@charset "UTF-8";
@import url('/themes/default/fonts/iranyekan/css/fontiran.css');


html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}


/* remember to define focus styles! */

:focus {
    outline: 0;
}

.fixtops {
    position: fixed;
    top: 90px;
    right: 2%;
    max-width: 300px;
}

.justmeted {
    width: 80px !important;
}


/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;

}

del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */

table {
    border-collapse: collapse;
    border-spacing: 0;
}

pre {
    white-space: pre-wrap;
    font-family: 'iranyekan';
    line-height: 2;
}

a,
a:visited,
a:hover,
a:active {
    text-decoration: none;
    color: inherit;
}

/* ------- code ------- */
body {
    font: 14px "iranyekan", sans-serif;
    direction: rtl;
    background: #f2f3f7;
    text-align: justify;
    line-height: 1;
}

input,
textarea,
select{
    font-family: 'iranyekan';
}

.center {
    width: 98%;
    max-width: 1300px;
    margin: 0 auto;
}

.d_flex {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.al-ce {
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.ju-sb {
    justify-content: space-between;
}

.ju-ce {
    justify-content: center;
}

.ju-sa {
    justify-content: space-around;
}

.fx-di-co {
    flex-direction: column;
}

.ma-y-1 {
    margin-top: 1em;
    margin-bottom: 1em;
}

.ma-y-2 {
    margin-top: 2em;
    margin-bottom: 2em;
}

.to-el {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.line2 {
    line-height: 2;
}

.circle-loading:after {
    width: 100%;
    height: 130%;
    background: url(/app_themes/default/images/svg/circle-loading.svg) no-repeat 100%;
    background-size: auto 100%;
    background-position: 50%;
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    margin-top: -4%;
}

.col-12 {
    width: 100%;
    flex: 12 0 0;
}

.col-11 {
    width: 91.6666666%;
    flex: 11 0 0;
}

.col-10 {
    width: 83.3333333%;
    flex: 10 0 0;
}

.col-9 {
    width: 75%;
    flex: 9 0 0;
}

.col-8 {
    width: 66.6666666%;
    flex: 8 0 0;
}

.col-7 {
    width: 58.3333333%;
    flex: 7 0 0;
}

.col-6 {
    width: 50%;
    flex: 6 0 0;
}

.col-5 {
    width: 41.6666666%;
    flex: 5 0 0;
}

.col-4 {
    width: 33.3333333%;
    flex: 4 0 0;
}

.col-3 {
    width: 25%;
    flex: 3 0 0;
}

.col-2 {
    width: 16.6666666%;
    flex: 2 0 0;
}

.col-1 {
    width: 8.3333333%;
    flex: 1 0 0;
}

[class^="col-"] {
    padding: 10px 15px;
    box-sizing: border-box;
}

.leftText {
    text-align: left;
    direction: ltr;
}

.ru-img-wrapper {
    width: 100%;
}

.ru-img-wrapper img {
    width: 100%;
    border-radius: 50%;
    overflow: hidden;
}

.haveLeftBTN {
    margin-left: 20px;
}

.haveRightBTN {
    margin-right: 20px;
}

.primryBTN span {
    color: #fff !important;
    margin: 0 !important;
    padding: 0 !important;
}

.BTN {
    display: flex;
    padding: 4px 30px;
    border-radius: 6px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.smallBTN {
    padding: 4px 15px;
    font-weight: 300;
    font-size: .9em;
}

.primryBTN {
    background: #ff6a00;
    color: #fff;
}

.SeColorBTN {
    background: #0088dc;
    color: #fff;
}

.btnIcon {
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.btnIcon i {
    line-height: 0;
    margin: 5px 0 5px 20px;
    font-size: 1.4em;
    z-index: 2;
}

.smallBTN.btnIcon i {
    margin: 2px 0 2px 8px;
}

.btnIcon span {
    z-index: 4;
}

.btnIcon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, .12);
    z-index: -1;
    transition: all .4s ease;
}

.btnIcon:hover::after {
    width: 150%;
    padding-top: 150%;
}

.btnIcon:hover i {
    animation: shake-horizontal 0.6s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
}

.secondaryBTN {
    border: 2px solid #aaa;
    color: #464646;
}

@keyframes shake-horizontal {

    0%,
    100% {
        transform: translateX(0);
    }

    10%,
    30%,
    50%,
    70% {
        transform: translateX(-3px);
    }

    20%,
    40%,
    60% {
        transform: translateX(3px);
    }

    80% {
        transform: translateX(1px);
    }

    90% {
        transform: translateX(-1px);
    }
}

.hoverBTN {
    position: relative;
    overflow: hidden;
    transition: all .3s ease;
}

.hoverBTN::before {
    content: "";
    position: absolute;
    transform: translate(-50%, -50%) rotate(45deg);
    background: rgba(0, 0, 0, .13);
    transition: all .3s ease;
}

.hoverBTN::before {
    width: 100%;
    padding-top: 100%;
    left: 200%;
    top: 50%;
    box-shadow: inset 0 0 8px rgba(0, 0, 0, .25)
}

.hoverBTN:hover {
    padding-right: 40px;
    padding-left: 20px;
}

.hoverBTN:hover::before {
    left: 150%;
    top: 50%;
}

.thirdBTN {
    border: 1px solid #ff6a00;
    color: #ff6a00;
}

.fourthBTN {
    color: #0088dc;
    border: 1px solid #0088dc;
}

.thirdBTN.hoverBTN::before {
    background: rgba(255, 106, 0, .17);
}

.thirdBTN.btnIcon::after {
    background: rgba(255, 106, 0, .17);
}

.disabledBTN {
    filter: grayscale(1);
    opacity: .3;
}

#Overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    display: none;
}

#showOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .2);
}

#showOverlay .circle-loading {
    width: 100px;
    height: 100px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.overlay {
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .5);
    display: grid;
    place-items: center;
    overflow: auto;
}

.overlayCenter {
    width: 98%;
    max-width: 900px;
    direction: rtl;
    margin: 25px auto;
}

.blueColor {
    color: #0088dc;
}

.slider {
    width: 100%;
    height: 100%;
    min-height: 400px;
}

.swiper-container {
    width: 100%;
}

.whiteBox {
    background: #fff;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .15);
    border-radius: 8px;
    padding: 15px;
    box-sizing: border-box;
}

.mainTitle {
    font-size: 2em;
}


.textBoxType1 {
    position: relative;
    margin: 10px 0;
}

.textBoxType1 input,
.textBoxType1 textarea,
.textBoxType1 select,
.select2-selection--single {
    width: 100% !important;
    background-color: transparent;
    border: 1px solid #CFCFCF;
    display: block;
    height: 24px;
    line-height: 24px;
    margin: 0;
    min-width: 0%;
    outline: none;
    padding: 5px 10px 0;
    min-height: 40px;
    border-radius: 3px;
    box-sizing: border-box;
}

.textBoxType1 input::placeholder,
.textBoxType1 textarea::placeholder,
.textBoxType1 select::placeholder {
    color: #fff;
}

.textBoxType1 input:focus::placeholder,
.textBoxType1 textarea:focus::placeholder,
.textBoxType1 select:focus::placeholder {
    color: #aaa;
}

.textBoxType1 input:disabled,
.textBoxType1 textarea:disabled,
.textBoxType1 select:disabled {
    background: #e0e0e0;
}

.textBoxType1 input:disabled~.textBoxLabel,
.textBoxType1 textarea:disabled~.textBoxLabel,
.textBoxType1 select:disabled~.textBoxLabel {
    display: none;
}

.textBoxType1 .textBoxLabel {
    position: absolute;
    top: 0;
    line-height: 40px;
    pointer-events: none;
    right: 10px;
    color: #757575;
    display: inline-block;
    width: fit-content;
    padding: 0 8px;
    transition: all .3s ease;
}

.necessary .textBoxLabel::after {
    content: "(الزامی)";
    color: #ff0000;
    font-size: .7em;
    margin-right: 7px;
}

.textBoxType1 input:focus,
.inputType1 textarea:focus {
    border: 1px solid #ff6a00;
}

.textBoxType1 input:focus~.textBoxLabel,
.textBoxType1 textarea:focus~.textBoxLabel,
.textBoxLabel.textBoxLabelFill {
    top: -10px;
    right: 10px;
    font-size: 1em;
    color: #ff6a00;
    background: #fff;
    line-height: 20px;
}

.textBoxLabel.textBoxLabelFill {
    color: #757575;
}

.textBoxType1.textBoxAlert::after {
    content: attr(data-alert);
    position: absolute;
    bottom: calc(100% - 1px);
    left: 0;
    background: #e04343;
    color: #fff;
    padding: 2px 15px;
    border-radius: 4px 4px 0 0;
}

.textBoxType1.textBoxAlert input {
    border: 1px solid red !important;
}

.textBoxHalf {
    width: 48%;
    margin: 1%;
}

.textBoxThird {
    width: 31.33%;
    margin: 1%;
}

.textBoxfull {
    width: 98%;
    margin: 1% auto;
}

.textBoxType1 textarea {
    padding: 12px 10px;
}

.tomanAfter::after {
    content: "تومان";
    font-weight: 300;
    font-size: .8em;
    margin-right: 5px;
}

.afterText::after {
    content: attr(data-title);
    font-size: .7em;
    display: block;
    color: #aaa;
    line-height: 2;
}

.leftBoxTitle h2:before,
.leftBoxTitle h1:before {
    content: "";
    position: absolute;
    width: 110%;
    height: 2px;
    border-radius: 50px;
    background: #ff6a00;
    right: 0;
    top: 120%;
    z-index: -1;
}

.leftBoxTitle h2,
.leftBoxTitle h1 {
    font-size: 1.3em;
    margin: 15px 0 25px;
    position: relative;
    display: inline-block;
    z-index: 1;
}

.leftBoxTitle h1 {
    font-size: 1.4em;
    font-weight: 700;
}

.UploadedPicsList li {
    max-width: 23%;
    margin: 10px 1%;
    border: 1px solid #aaa;
    border-radius: 8px;
    position: relative;
}

.deletePic {
    position: absolute;
    top: 100%;
    left: 30%;
    transform: translate(-50%, -50%);
    color: red;
    background: #fff;
    font-size: 1.2em;
    padding: 5px 4px;
    transition: all .3s ease;
    border-radius: 10px;
    cursor: pointer;
    line-height: 0;
    border: 1px solid #faa;
}

.deletePic:hover {
    background: red;
    color: #fff;
}

.UploadedPicsList img {
    width: 100%;
    border-radius: 8px;
}

.UploadBtn {
    justify-content: center;
    align-items: center;
    width: 23%;
    border: 1px solid #00b0f0 !important;
    color: #00b0f0;
    font-size: 1.3em !important;
    width: 80px;
    height: 80px;
    border-radius: 8px;
}

.CheckBoxs[type='checkbox'] {
    cursor: pointer;
    outline: none;
    -webkit-appearance: none;
    display: inline-block;
    position: relative;
    height: 16px;
    width: 16px;
    background-color: transparent;
    border: 2px solid #BDC3C7;
    border-radius: 2px;
    transition: background-color 0.3s ease, border 0.3s ease;
    margin: 0 10px;
}

.CheckBoxs[type='checkbox']:hover {
    background-color: white;
}

.CheckBoxs[type='checkbox']::before,
input[type='checkbox']::after {
    position: absolute;
    height: 0;
    width: 1.76px;
    background-color: #FFFFFF;
    display: inline-block;
    transform-origin: left top;
    border-radius: 4px;
    margin: -1px 0 0 -4px;
    content: '';
}

.CheckBoxs[type='checkbox']::before {
    top: 4.96px;
    left: 3.36px;
    transform: rotate(-135deg);
}

.CheckBoxs[type='checkbox']::after {
    top: 2.08px;
    left: 0.16px;
    transform: rotate(-45deg);
}

.CheckBoxs[type='checkbox']:checked {
    background-color: #ff6a00;
    border: 8px solid #ff6a00;
}

.CheckBoxs[type='checkbox']:checked::before,
input[type='checkbox']:checked::after {
    box-shadow: 0 0 0 0.4px #FFFFFF;
}

.CheckBoxs[type='checkbox']:checked::before {
    height: 8px;
    animation: animatetop 0.3s ease;
}

.CheckBoxs[type='checkbox']:checked::after {
    height: 4px;
    animation: animatebottom 0.3s ease;
}

.CheckBoxs[type='checkbox'].select-all-checkbox {
    margin-left: 13px;
}

@keyframes animatetop {
    0% {
        height: 0;
    }

    50% {
        height: 0;
    }

    100% {
        height: 8px;
    }
}

@keyframes animatebottom {
    0% {
        height: 0;
    }

    50% {
        height: 0;
    }

    100% {
        height: 4.2105263158px;
    }
}

.CheckBoxLabel {
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
}

.radioButtons[type='radio'] {
    cursor: pointer;
    outline: none;
    -webkit-appearance: none;
    display: inline-block;
    position: relative;
    height: 16px;
    width: 16px;
    background-color: transparent;
    border: 2px solid #BDC3C7;
    border-radius: 50%;
    transition: border 0.3s ease, border 0.3s ease;
    margin: 0 10px;
}

.radioButtons[type='radio']:hover {
    border: 2px solid #ff6a00;
}

.radioButtons[type='radio']:checked {
    border: 6px solid #ff6a00;
}

.radioLabel {
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
}


/* ---- alert ----- */

.showAlert {
    background: #fff;
    position: fixed;
    top: 12vh;
    right: 10vh;
    padding: 7px 20px 5px 40px;
    border-radius: 4px;
    box-shadow: 0 5px 12px rgba(0, 0, 0, .15), 0 1px 4px rgba(0, 0, 0, .2);
    max-width: 45vw;
    z-index: 9999999;
    transform: rotateX(90deg);
    transition: all .3s ease;
    font-size: .85em;
    width: auto;
    max-width: 30%;
}

.openAlert {
    transform: rotateX(0deg);
}

.alertIcon {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(50%, -50%) scale(0);
    padding: 7px;
    border-radius: 50%;
    color: #fff;
    font-size: 2em;
    height: 40px;
    width: 40px;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    transition: all .3s ease .1s;
}

.openAlert .alertIcon {
    transform: translate(50%, -50%) scale(1);
}

.alertIcon i {
    position: relative;
    top: 3px;
}

.alertText {
    padding: 0;
    width: 100%;
    margin-right: 25px;
}

.showAlert .d_flex {
    align-items: center;
    height: 100%;
}

.closeAlert {
    position: absolute;
    top: 15px;
    left: 10px;
    cursor: pointer;
}

.alertText h4 {
    font-size: 1.2em;
    font-weight: bold;
    margin: 15px 0 10px;
}

.alertText p {
    margin: 5px 0;
    line-height: 1.7;
}

.showAlert::before,
.showAlert::after,
.alertFull {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 5px;
    border-radius: 4px;
}

.showAlert::after {
    height: 100%;
    z-index: -1;
}

.alertFull {
    background: rgba(0, 0, 0, .25) !important;
    width: 0%;
    transition: all 0s linear;
}

.AlertMsg .alertIcon {
    background: #F14848;
    box-shadow: 0 3px 6px rgba(255, 0, 0, .4);
}

.AlertMsg .alertText h4 {
    color: #900000;
}

.AlertMsg.showAlert::before {
    background: #F14848;
}

.AlertMsg.showAlert::after {
    background: rgba(255, 0, 0, .1);
}

.warningMsg .alertIcon {
    background: #FFDD30;
    box-shadow: 0 3px 6px rgba(255, 221, 48, .5);
}

.warningMsg .alertText h4 {
    color: #5B4C00;
}

.warningMsg.showAlert::before {
    background: #FFDD30;
}

.warningMsg.showAlert::after {
    background: rgba(255, 221, 48, .2);
}

.warningMsg.alertFull {
    background: rgba(0, 0, 0, .13) !important;
}

.successMsg .alertIcon {
    background: #54AE05;
    box-shadow: 0 3px 6px rgba(84, 174, 5, .5);
}

.successMsg .alertText h4 {
    color: #234B00;
}

.successMsg.showAlert::before {
    background: #54AE05;
}

.successMsg.showAlert::after {
    background: rgba(84, 174, 5, .25);
}

.AlertMsgBox {
    color: red;
    border: 1px dashed red;
    background: #fff7f7;
}

.warningMsgBox {
    color: #8c7504;
    border: 1px dashed #b59700;
    background: #fff8d9;
}

.successMsgBox {
    color: #336905;
    border: 1px dashed #54ae05;
    background: #d5ebc7;
}

.showMsgBox {
    border-radius: 8px;
    padding: 10px 0;
    display: none;
    text-align: center;
    margin: 15px 0;
    line-height: 1.6;
}

/* ----- swiperjs ----- */
.swiper-slide {
    background-size: cover;
    background-position: center;
}

.gallery-top {
    height: 80%;
    width: 100%;
}

.gallery-thumbs {
    height: 20%;
    box-sizing: border-box;
    margin: 10px;
    padding: 0 5px !important;
}

.gallery-thumbs .swiper-slide {
    width: 25%;
    height: 100%;
    opacity: 0.4;
}

.gallery-thumbs .swiper-slide-thumb-active {
    opacity: 1;
}

.CommissionFee {
    position: absolute;
    top: 110%;
    right: 0;
    line-height: 1;
    font-size: .9em;
    color: #757575;
}

.CommissionLabel {
    position: relative;
    margin: 5px 15px !important;
}

.slfPriceWraper {
    align-items: center;
    justify-content: space-between;
    margin: 15px 0;
}

.newLinkWrapper {
    line-height: 2.5;
    display: none;
}

.picUploadNots li {
    font-size: .9em;
    color: #646464;
}

.picUploadNots li::before {
    content: "\e01b";
    margin-left: 10px;
    font-family: 'landikaiconfont';
}

.TableHolder {
    margin: 0 auto;
    width: 100%;
    text-align: left;
    color: #464646;
    cursor: default;
    border-spacing: 0;
    border-collapse: collapse;
    text-align: center;
}

.TableHolder tr:first-child th {
    border-bottom: 1px solid #0088dc;
    padding: 15px 15px;
    background-color: #ffffff44;
    font-size: 1.1em;
}

.TableHolder tr td,
.TableHolder tr:not(:first-child) th {
    padding: 20px;
    position: relative;
    font-weight: normal;
}

.TableHolder tr:not(:first-child) {
    padding: 8px 0;
}

.TableHolder tr:nth-child(odd):not(:first-child) {
    background-color: #F2FAFF;
}

.actionList li i {
    cursor: pointer;
    font-size: 1.3em;
}

.actionList li {
    position: relative;
    margin: 0 10px;
}

.actionList li span {
    position: absolute;
    max-width: 0;
    max-height: 0;
    overflow: hidden;
    bottom: 105%;
    left: 50%;
    transform: translate(-50%, 0);
    color: #fff;
    white-space: nowrap;
    padding: 2px 10px;
    border-radius: 5px;
    box-sizing: border-box;
    transition: all .4s ease;
    opacity: 0;
    font-size: .85em;
    line-height: 1.5;
}

.actionList li:hover span {
    max-width: 200px;
    max-height: 100px;
    opacity: 1;
}

.deleteLink span {
    background: red;
}

.showLink span {
    background: #0088dc;
}

.editLink span {
    background: #54AE03;
}

.sendEntry span {
    background: #ff6a00;
}

.deleteLink {
    color: red;
}

.showLink {
    color: #0088dc;
}

.editLink {
    color: #54AE03;
}

.sendEntry {
    color: #ff6a00;
}

.linkCondition i {
    font-size: 1.3em;
    margin-left: 10px;
    padding: 5px 0;
    box-sizing: border-box;
    border-radius: 3px;
}

.linkPay {
    background: #ffdddd;
    color: red;
}

.linkSending {
    background: #fff2e9;
    color: #e66000;
}

.linkReceive {
    background: #e3f4ff;
    color: #0088dc;
}

.linkFinish {
    background: #f2ffe6;
    color: #3f8105;
}

.confirmDel b {
    white-space: nowrap;
    margin: 5px 0;
    display: inline-block;
    font-size: .9em;
    font-weight: 400;
}

.cancelDelBTN {
    padding: 0 15px;
    border-radius: 50px;
    border: 1px solid #ff6a00;
    color: #ff6a00;
    cursor: pointer;
}

.confirmDelBTN {
    background: #e80e0e;
    color: #fff;
    padding: 0 15px;
    border-radius: 50px;
    cursor: pointer;
}

.confirmDel {
    position: absolute;
    left: 0;
    bottom: 0;
    background: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
    border-radius: 5px;
    padding: 10px 25px;
    color: #464646;
    font-weight: 400;
    font-size: 1.1em;
    transform: scale(0);
    transform-origin: 0 100%;
    transition: all .3s ease;
}

.confirmDel.open {
    transform: scale(1);
}

.finalPriceLine {
    background: #FFF6EF;
    padding: 25px;
    width: calc(100% + 30px);
    margin-right: -15px;
    box-sizing: border-box;
    color: #ff6a00;
    font-weight: 700;
  	display:none;
}

.priceLine {
    color: #464646;
    background: #fff;
    padding: 25px;
    border-top: 1px solid #e8e8e8;
    font-size: .9em;
    font-weight: 400;
    width: calc(100% + 30px);
    margin-right: -15px;
    box-sizing: border-box;
  	display:none;
}

.successfactor {
    text-align: center;
    line-height: 1.5;
    font-size: 1.4em;
    background: #FAFFF5;
    border: 1px solid #54AE03;
    width: 85%;
    margin: 0 auto;
    border-radius: 5px;
    color: #54AE03;
    padding: 25px;
}

.successfactor h1 {
    font-size: 1.2em;
    font-weight: 900;
}

.qaList {
    line-height: 2;
    width: 85%;
    margin: 25px auto;
}

.qaList li:not(:last-child) {
    border-bottom: 1px solid #ddd;
}

.qaList li {
    padding: 25px 0;
}

.qaList h3 {
    color: #0088dc;
    font-weight: 700;
    font-size: 1.1em;
    cursor: pointer;
}

.qaList .toggle {
    display: none;
    margin-top: 10px;
}

.qaList h3::before {
    content: "\e004";
    font-family: 'landikaiconfont';
    font-size: 1.5em;
    line-height: 0;
    position: relative;
    top: 5px;
}

.trackingCodeEntry {
    width: 50%;
    margin: 0 auto;
}

.trackingItemWrapper {
    background: #eaf6fd;
    padding: 15px 25px;
    text-align: center;
    font-size: 1.1em;
    border-radius: 5px;
    border: 2px dashed #0088dc;
}

.showNewCreatedLink {
    padding: 25px;
    background: #f5ffec;
    border: 2px dashed #54ae05;
    font-size: 1.2em;
    border-radius: 5px;
}

.showPayLinkDetails {
    display: inline-block;
    cursor: pointer;
    color: #0088dc;
    margin-right: 15px;
    font-size: .85em;
}

.showPayLinkDetails i {
    position: relative;
    top: 2px;
    margin-right: 3px;
}

.showlinkTitle span {
    font-weight: 100;
    font-size: .9em;
    margin-right: 25px;
    opacity: .6;
}

.showlinkTitle h2 {
    font-size: 1.1em;
    font-weight: 700;
}

.showlinkTitle {
    border-bottom: 1px solid #ccc;
    padding: 0 5px 10px;
    margin-bottom: 15px;
}

.showLinkDes p {
    text-align: right;
    line-height: 2;
    margin-bottom: 10px;
}

.showLinkPic li {
    margin: 0 10px;
    max-width: 33%;
}

.showLinkDes p span:last-child {
    font-weight: 700;
}

.linkLastStatus {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000000cc;
    z-index: 9999;
}

.customerInfo i {
    font-size: 1.5em;
    line-height: 0;
    position: relative;
    top: 5px;
    margin-left: 10px;
}

.trackingCodeCopy {
    font-size: 1.5em;
    font-weight: 700;
    letter-spacing: 3px;
}

.sellerTrakinginfo p {
    font-size: 1.1em;
}

.sellerTrakinginfo span {
    color: #959595;
    font-size: .8em;
}

.waitForSendWrapper {
    border: 1px solid #bbb;
    border-radius: 8px;
}

.hrLineGray {
    position: relative;
    display: inline-block;
}

.hrLineGray::after {
    content: "";
    position: absolute;
    top: 100%;
    right: 0;
    width: 120%;
    height: 2px;
    border-radius: 50px;
    background: #757575;
}

.spanTitle {
    color: #757575;
    font-size: .9em;
}


.toSendItmes li {
    margin: 10px 0;
    font-size: .9em;
}

.selectGoods {
    min-width: 25px;
    background: #aaa;
    cursor: pointer;
    position: relative;
    border-radius: 0 10px 10px 0;
    transition: all .3s ease;
}

.active .selectGoods {
    background: #0088dc;
}

.factorGoodsDetail {
    border: 1px solid #aaa;
    border-radius: 10px 0 0 10px;
    width: 100%;
    padding: 0;
}

.active .factorGoodsDetail {
    border: 1px solid #0088dc;
}

.active .selectGoods i::before {
    content: "\e048";
    background: transparent;
    border: none;
    width: inherit;
    height: inherit;
}

.selectGoods i::before {
    content: "";
    width: 15px;
    height: 15px;
    background: #fff;
    display: block;
    border: 1px solid #444;
    border-radius: 2px;
}

.selectedThis {
    display: none;
}

.selectGoods i {
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.3em;
}

.sentItems li {
    max-width: 100px;
    position: relative;
    margin: 20px 10px;
}

.sentItems li img {
    width: 100%;
}

.sentItems li::after {
    content: "\e01c";
    font-family: landikaiconfont;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 25px;
    height: 25px;
    background: #54AE05;
    line-height: 25px;
    border-radius: 50%;
    color: #fff;
    text-align: center;
}

.FP_Infos {
    width: 85%;
    padding: 0 10px 0;
    flex-direction: column;
    justify-content: space-between;
    margin: 20px 0;
}

.factorInfo {
    color: #646464;
}

.factorInfo p span {
    color: #858585;
}

.factorInfo p {
    color: #212121;
}

.sflHeader {
    background: #fff;
    box-shadow: 0 3px 6px rgb(0 0 0 / 10%);
    z-index: 999;
    position: relative;
    padding: 20px 15px;
    box-sizing: border-box;
    border-radius: 0 0 8px 8px;
    margin-bottom: 25px;
}
.logo {
    min-height: 30px;
    width: 100%;
    background: url(/themes/safeland/images/safeland-logotype.svg) no-repeat 0;
    background-size: auto 100%;
}
.sflHeaderMenu li:hover {
    top: -3px;
}
.sflHeaderMenu li:not(:first-child) {
    margin-right: 45px;
}
.sflHeaderMenu li {
    position: relative;
    transition: all .3s ease;
    top: 0;
}
.sflHeaderMenu li:hover:after {
    opacity: 1;
    top: 140%;
}
.sflHeaderMenu li::after {
    content: "";
    height: 2px;
    background: #1870b8;
    position: absolute;
    width: 120%;
    top: 170%;
    left: -10%;
    opacity: 0;
    transition: all .3s ease;
    border-radius: 50px;
}
.sflHeaderMenu li a {
    padding: 15px 0;
}
.footerWrapper {
    border-top: 2px solid #0088dc;
    background: #757b80;
    padding: 10px 25px;
    text-align: center;
    font-size: .9em;
    color: #fff;
    margin-top: 25px;
}

	.factorBox{
        border: 1px solid #ccc;
        padding: 15px;
        border-radius: 5px;
  	}
  .factorTable {
    text-align: right;
    border: 2px solid #0088dc;
}
  .factorTable th {
    background: #0088dc !important;
    color: #fff;
}
  .factorTable td:not(:last-child) {
    border-left: 1px solid #aaa;
}
  .factorTable td {
    font-size: 1.2em;
    font-weight: 600;
}

  .loginwraper {
    position: fixed;
    top: 0;
    left: 0;
    background: #0000007d;
    width: 100%;
    height: 100%;
    z-index: 999;
}
.plzlogin {
    max-width: 500px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background: #fff;
    padding: 25px;
    border-radius: 8px;
    box-shadow: 0 3px 6px rgb(0 0 0 / 20%);
}
.plzlogin li {
    width: 100%;
    color: #575757;
    position: relative;
}
.PL-FormTitle {
    color: #464646;
    font-weight: 700;
    margin: 20px 0 40px;
    font-size: 1.2em;
}
label.PL-Label {
    margin: 5px 0 10px;
    display: block;
}
.PL-ShowAlert {
    position: absolute;
    font-size: 85%;
    top: -12px;
    left: -20px;
    background: #ff4150;
    color: #fff;
    padding: 8px 20px 12px;
    border-radius: 3px;
    font-weight: 300;
    z-index: 0;
    display: none;
}
span.PL-HLine {
    content: "a";
    position: absolute;
    width: 1px;
    height: 35px;
    top: 31px;
    left: 12%;
    background: #c8c8c8;
    z-index: 31;
}.PL-btm {
    margin: 40px auto 30px;
    display: block;
    width: 100%;
    height: 45px;
    line-height: 41px;
    font-size: 110%;
    background: #ff6a00;
    border-radius: 6px;
    text-align: center;
    color: #fff;
    cursor: pointer;
}
.plzlogin li:last-child a {
    font-size: 100%;
    text-align: center;
    display: block;
    margin-bottom: 20px;
}

.plzlogin li a {
    color: #0088dc;
    font-size: 85%;
}
  .plzlogin li input, .plzlogin li textarea {
    width: 100%;
    height: 45px;
    box-sizing: border-box;
    padding: 6px 25px 6px 15%;
    border: 1px solid #c8c8c8!important;
    font-size: 90%;
    transition-duration: .5s;
    color: #464646;
    margin-bottom: 7px;
    text-align: left;
    line-height: 45px;
    direction: ltr;
}
  .plzlogin li .fa {
    position: absolute;
    left: 14px;
    top: 37px;
    z-index: 1;
    color: #666;
    cursor: pointer;
    font-size: 140%;
}

  @media print{
    @page {
      size: A4 landscape;
      margin: 0 0 0 0;
    }
    body {
      -webkit-print-color-adjust: exact !important;
      color-adjust: exact !important;
    }
    header,footer,.notForPrint{
      display:none !important,
    }
  }



@media only screen and (max-width: 780px) {
 
  [class^="col-"] {
    padding: 5px 10px;
}
.mobileWrap {
    flex-wrap: wrap;
}

.mobileWrap>[class^="col-"] {
    flex: 0 0 auto;
}
  .mobileMenuBTN::before {
    content: "\e04f";
    font-family: 'landikaiconfont';
    font-size: 2em;
    cursor: pointer;
    top: 0;
    right: 0;
}
.sflMobileMenu::before {
    content: "\e04f";
    font-family: 'landikaiconfont';
    font-size: 2em;
    cursor: pointer;
}
.sflMobileMenu li {
    display: none;
}
  .sflMobileMenu {
    position: relative;
    width: 80%;
    height: 100%;
    z-index: 9999;
    top: 0;
    right: -100%;
    transition: all .3s ease;
  }
  .sflMobileMenu::after {
    content: "";
    position: fixed;
    width: 20%;
    height: 100%;
    right: -20%;
    top: 0;
    background: #000000aa;
    transition: all .3s ease;
    opacity: 0;
}
.logo {
    min-height: 20px;
}
.trackingCodeEntry {
    width: 100%;
}
.leftBoxTitle h1 {
    font-size: 1.3em;
}
.leftBoxTitle h2, .leftBoxTitle h1 {
    font-size: 1.2em;
    margin: 10px 0 20px;
}

.col-12m.col-11,.col-10,.col-9,.col-8,.col-7,.col-6 {
    width: 100%;
}

.col-5,.col-4 {
    width: 75%;
}

.col-3,.col-2 {
    width: 50%;
}

.col-1 {
    width: 25%;
}
  .trackingItemWrapper {
    padding: 5px 15px;
    border: 1px dashed #0088dc;
}
  .TableHolder tr {
    width: 100%;
    border: 1px solid #0088dc;
    border-radius: 5px;
    margin: 10px 0;
    display: block;
}
.TableHolder td {
    display: block;
    width: 100%;
    padding: 7px 10px !important;
    box-sizing: border-box;
}
.TableHolder th{
    display:none;
}
.TableHolder {
    text-align: right;
}
  .TableHolder td::before {
    content: attr(data-title);
    color: #999;
    font-weight: 300;
}
.TableHolder tr:first-child {
    display: none;
}
  
.sflMenuOpen {
    position: fixed;
    width: 80%;
    right: 0;
    background: #fff;
    flex-wrap: wrap;
    padding: 50px 0;
}

.sflMenuOpen li {
    display: block !important;
    width: 100%;
    margin: 0 25px !important;
}

.sflMenuOpen li::after{
    display: none !important;
}

.sflMenuOpen::before{
    content: "\e070";
    color: red;
    position: absolute;
    top: 20px;
    left: 20px;
}

.sflMenuOpen::after {
    right: 80%;
    opacity: 1;
}
  .factorInfo p span {
    display: block;
    margin-bottom: 5px;
}
  .paymentInfoWrapper {
    flex-direction: column-reverse;
}
  .paymentInfoWrapper>.col-4 {
    width: 98%;
    box-sizing: border-box;
    margin: 0 auto 25px;
}
  .priceLine,.finalPriceLine {
    width: calc(100% + 20px);
    margin-right: -10px;
}
  
}