.desctop-tm-wrapper {background-color: #fff}
.desctop-tm-top-body {height: 32px}
.desctop-tm-wrapper {position: sticky;top: -26px;z-index: 30;box-shadow: 0 0 1px 1px rgba(0,0,0,0.25)}

.desctop-tm-top-body {display: flex;align-items: center}
.tm-t-r {text-align: right}
.tm-t-m {width: 100%;display: flex;align-items: center;justify-content: center;gap: 10px}
.tm-t-m a {white-space: nowrap}
.tm-t-l {display: flex;align-items: center}
.tm-t-l span {width: 18px;height: 18px;margin-right: 5px;display: flex;align-items: center;justify-content: center}
.tm-t-l span svg {fill: orange;width: 18px;height: 18px}
.tm-t-l, .tm-t-r {font-size: 15px;color: #444}
.tm-t-m a {color: #111;font-weight: 500;font-weight: 400}

@media (width >= 980px) {
    .tm-t-l, .tm-t-r {width: 220px;min-width: 220px}
}
@media (width < 1200px) {
    .desctop-tm-top-body {padding-left: 8px;padding-right: 12px}
}
@media (width < 980px) {
    .desctop-tm-top-body {justify-content: space-between}
    .tm-t-m {display: none}
    /* .tmAllMenuBtn {display: flex!important;} */
}
@media (width < 520px) {
    .desctop-tm-top-body {display: none}
}






.desctop-tm-top-body {
    /* padding-top: 5px; */
}
.desctop-tm-bottom-body {
/*     height: 55px; */
    padding-bottom: 7px
}
.desctop-tm-bottom-body {display: flex;align-items: center}

.tm-b-l .site-name {
    font-weight: bold;font-size: 28px;line-height: 28px;padding-bottom: 2px;color: #111;
/*     display: flex;
    align-items: end;
    align-items: center; */
}
/* .tm-b-l .site-name span {
    display: inline-block;
    width: 6px;
    height: 6px;
    background: orange;
    border-radius: 50%;
    margin: 0 3px;
    margin-bottom: -5px
} */
 .tm-b-l .site-name span {
/*         display: inline-block;
    padding: 0 1px; */
    color: orange;
 }
.tm-b-l .site-slogan {font-size: 13px;line-height: 13px;color: #444}

.tm-b-r {display: flex;align-items: center;justify-content: end;gap: 1px}
.tm-b-r > div {
    position: relative;
    width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;
    /* cursor: pointer */
}


.tmMyCard {position: relative}
.tmMyCard a {z-index: 2}
.tmMyCard:after {
    position: absolute;transition: 0.3s;opacity: 1;
    z-index: 1;
}
@media (width >= 520px) {
    .tmMyCard:after {
        content: attr(data-cnt);background: #fff;
        box-shadow: 0 0 5px 1px rgba(0,0,0,0.25);
        color: #000;font-size: 10px;line-height: 10px;right: 23px;bottom: 5px;padding: 2px 4px;border-radius: 3px;
    }
    body.cardReady .tmMyCard:after {
        background: orange;
    }
}
@media (width < 520px) {
    .tmMyCard:after {
        content: '';position: absolute;background: orange;
        border-radius: 50%;width: 7px;height: 7px;right: 3px;bottom: 3px;
    }
}
.tmMyCard[data-cnt="0"]:after {opacity: 0}
.tmMyCard[data-cnt=""]:after {opacity: 0}


.tm-b-r > div.tmAllMenuBtn,
.tm-b-r > div.tmrSearchBtn {display: none}
.tm-b-r > div svg {width: 28px;height: 28px;fill: #444}
.tm-b-r > div:hover svg {fill: orange}
@media (width >= 1200px) {
    .tm-b-r {
        position: relative;
        /* margin-right: -7px */
    }
}
@media (width >= 520px) {
    .tm-b-l, .tm-b-r {width: 300px;min-width: 300px;max-width: 300px}
    .tm-b-m {width: 100%}
}
@media (width < 1600px) {
    .tm-b-l, .tm-b-r {width: 280px;min-width: 280px;max-width: 280px}
}
@media (width < 1200px) {
    .desctop-tm-bottom-body {padding-left: 12px;padding-right: 4px}
    .tm-b-l, .tm-b-r {width: 260px;min-width: 260px;max-width: 260px}
/*     .tm-b-l, .tm-b-r {width: 300px;min-width: 300px;max-width: 300px} */
    .desctop-tm-bottom-body {
        padding-left: 12px!important;
        padding-right: 12px!important;
    }
}
@media (width < 980px) {
    .tm-b-l, .tm-b-r {width: 240px;min-width: 240px;max-width: 240px}
}
@media (width < 800px) {
    /* .tmrSearchBtn {display: flex!important} */
    .tm-b-m {display: none}
    .desctop-tm-bottom-body {justify-content: space-between}
}

@media (width < 520px) {
    .desctop-tm-wrapper {top: 0}
    .desctop-tm-bottom-body {
        /* height: 50px; */
        padding-bottom: 0
    }
    .tm-b-l .site-name {font-size: 22px;line-height: 22px;padding-bottom: 0px}
    .tm-b-l .site-slogan {font-size: 11px;line-height: 11px}
    .tm-b-l, .tm-b-r {width: auto;min-width: auto;max-width: auto}

    .tm-b-r > div {width: 30px;height: 30px;}
    .tm-b-r > div svg {width: 22px;height: 22px}
}
@media (width < 370px) {
    .desctop-tm-bottom-body {
        /* height: 45px */
    }
    .tm-b-l .site-slogan {display: none}
    .tm-b-l .site-name {font-size: 20px;line-height: 20px}
}










.tm-searchMenu {display: flex;align-items: center}
.tm-searchMenu > div {width: 40px;height: 40px}
.tmSearchBtn {display: flex;align-items: center;justify-content: center;margin-right: 2px;cursor: pointer}
.tmSearchBtn svg {width: 20px; height: 20px;fill: orange}
.tmSearchBtn:hover {opacity: 0.7}














.TM-SEARCH-WRAP {position: relative;height: 40px;background: #fff;display: flex;align-items: center;border: solid 1px #eee;border-radius: 6px}
.tmCatalogBtn {display: flex;align-items: center;padding: 0 5px 0 10px;color: #111;height: 30px;cursor: pointer}
.TM-SEARCH-WRAP .sep {width: 1px;height: 25px;background: #ddd;margin-left: 10px}
.TM-SEARCH-WRAP input {display: block;width: 100%;border: 0px;outline: none;height: 40px;background: rgba(0,0,0,0);padding-left: 15px;font-size: 15px}


.search-area-select-wrap {
    position: absolute;
    top: 90px;
    left: calc(50vw - 310px);
    width: 620px;
    display: none;
    font-size: 14px; 
}
body.search-active .search-area-select-wrap {display: block}
.search-area-select-body {
    display: flex;
    justify-content: center;
    background: #fff;
    box-shadow: 0 1px 1px 0px rgba(0,0,0,0.15);
    padding: 5px 0;
    margin: 0 auto;
    border-radius: 0 0 6px 6px;
    gap: 15px;
    width: 510px;
}
.search-area-select-body div {cursor: pointer}
.selectSearchAreaBtn {display: flex;align-items: center}
.selectSearchAreaBtn:before {
    content: '';display: block;width: 10px;height: 10px;
    background: #ddd;border: solid 2px #fff;outline: solid 1px #cac9c9;border-radius: 50%;margin-right: 5px;transition: 0.3s}
.selectSearchAreaBtn.active:before {
    background: #80257b;
    background: orange;
    border: solid 2px #fff;outline: solid 1px #888
}

/* 
@media (width < 1400px) {
    .desctop-tm-wrapper {
        display: none;
    }
} */












.tm-tooltip {position: absolute;bottom: -20px;left: calc(50% - 50px);color: #fff;font-size: 10px;width: 100px;justify-content: center;display: none}
.tm-tooltip > div {background: #000;text-align: center;border-radius: 4px;display: inline-block;margin: 0 auto;padding: 0 5px}
.tm-tooltip > span {width: 6px;height: 6px;background-color: #000;position: absolute;top: -3px;left: calc(50% - 3);transform: rotate(45deg)}
.jso-tm-tooltip:hover .tm-tooltip {display: flex}
@media (width < 1200px) {
    .tm-tooltip {display: none!important}
}



























.tm-b-r {
    gap: 5px;
}
.tm-b-r > div {
    border: solid 1px #f7f7f7;
    border-radius: 6px;
}




.desctop-tm-top-wrap {
    padding: 8px 0
}
.desctop-tm-bottom-body {

    padding:0px 0 12px 0;
}
.desctop-tm-wrapper {
    top: -37px
}