@media (max-width: 1199px) {
    .shop_header {
    gap:8px;
    }
    .shop_header > .d-flex.align-items-center {
    order:1;
    }
    .shop_header > .navi_wrapper {
    order:3;
    margin-left:0;
    }
    .navi_wrapper {
    align-items:center;
    }
    .navi_wrapper > section,
    .navi_wrapper .login_wrapper,
    .navi_wrapper #the_account,
    .navi_wrapper .wish_wrapper,
    .navi_wrapper .cartbtn_wrapper,
    .navi_wrapper .login_wrapper a,
    .navi_wrapper #the_account a,
    .navi_wrapper .wish_wrapper a,
    .navi_wrapper .cartbtn_wrapper a {
    display:flex;
    align-items:center;
    height:25px;
    }
    .navi_wrapper .menu-open {
    width:29px;
    height:25px;
    max-height:25px;
    margin:0 4px 0 0 !important;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    flex:0 0 29px;
    font-size:0;
    line-height:0;
    overflow:hidden;
    transition:transform .22s ease;
    }
    .navi_wrapper .menu-open .open {
    width:23px;
    height:23px;
    max-height:23px;
    display:block;
    overflow:hidden;
    -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,<svg width="23" height="23" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 23 23"><path d="M0 0h23v2.2H0zM0 10.4h23v2.2H0zM0 20.8h23V23H0z"/></svg>');
    mask-image: url('data:image/svg+xml;charset=utf-8,<svg width="23" height="23" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 23 23"><path d="M0 0h23v2.2H0zM0 10.4h23v2.2H0zM0 20.8h23V23H0z"/></svg>');
    -webkit-mask-size:23px 23px;
    mask-size:23px 23px;
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
    -webkit-mask-position:center;
    mask-position:center;
    transition:background-color .22s ease, transform .22s ease;
    transform:rotate(0deg) scale(1);
    }
    .navi_wrapper .menu-open:hover {
    transform:scale(1.04);
    }
    .navi_wrapper .menu-open:hover .open,
    .mobile-menu-active .navi_wrapper .menu-open .open {
    background-color:#910e24;
    -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,<svg width="23" height="23" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 23 23"><path d="M1.5 0 23 21.5 21.5 23 0 1.5zM21.5 0 23 1.5 1.5 23 0 21.5z"/></svg>');
    mask-image: url('data:image/svg+xml;charset=utf-8,<svg width="23" height="23" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 23 23"><path d="M1.5 0 23 21.5 21.5 23 0 1.5zM21.5 0 23 1.5 1.5 23 0 21.5z"/></svg>');
    transform:rotate(90deg) scale(1);
    }
    .mobile-menu-toggle {
    display:flex;
    }
    .logo_lnk img.the_logo {
    margin-left:0;
    }


}

/* SIDEBAR */
.top_navigation_container {
display: flex;
}
.categories_sidebar{
width: auto;
display:flex;
margin-right: 9px;
}
/* TITLE */
.categories_title {
background:#fff;
margin-top: 3px;
/*height:45px;*/
height:42px;
display:flex;
align-items:center;
gap:12px;
padding:0 20px;
font-weight:700;
flex-shrink:0;
cursor: pointer;
border-radius: 9px 9px 0 0;
border-bottom:1px dashed var(--c-sec);
}
.menu_icon{
font-size:20px;
}
/* CONTENT */
ul.categories_content{
flex:1;
background:#fff;
display:flex;
flex-direction:column;
box-shadow:0 10px 30px rgba(0,0,0,.08);
}
/* GROUP */
/*LI*/
li.category_group{
position:relative;
height:40px;
padding: 0 9px;
display:flex;
align-items:center;
border-top:0px solid var(--c-lightgray);
border-bottom:0px solid var(--c-lightgray);
transform .2s ease;
}
li.category_group:hover{
border-top:1px solid var(--c-lightgray);
border-bottom:1px solid var(--c-lightgray);
}
@media (max-width: 1199px) {
    li.category_group{
    -webkit-transition: all 0.2s linear;
    -webkit-transition-property: all;
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear;
    -webkit-transition-delay: initial;
    transition-delay: initial;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    transition-property: all;        
    }
    li.category_group:hover{
    border-top:0 solid var(--c-lightgray);
    border-bottom:0 solid var(--c-lightgray);
    padding-left: 5px;
    }
}

/* PLACEHOLDER */
.sidebar_placeholder{
width:220px;
flex-shrink:0;
position:relative;
z-index:2;
}
@media (max-width: 1400px) {
    .sidebar_placeholder {
      width:205px;
    }
}
.sw_banner {
position: relative;
width: 100%;
overflow: hidden;
}
.swipeslider {
width: 100%;
height:450px;
overflow: hidden;
background: #fff;
}
.swiper-slide {
position: relative;
overflow: hidden;
}
.slide-image-wrap {
position: absolute;
inset: 0;
z-index: 1;
}
.slide-image {
width: 100%;
height: 100%;
object-fit: cover;
transition:
    transform 7s ease,
    filter 1s ease;
transform: scale(1);
will-change: transform;
}
.slide-overlay {
position: absolute;
inset: 0;
z-index: 2;
}
.slide-content {
position: absolute;
inset: 0;
z-index: 10;
display: flex;
flex-direction: column;
width: 100%;
height: auto;
}
/*.slide-content .cont-wrapp {
width: 100%;
height: auto;
}*/
.slide-title {
font-size:37px;
font-weight:700;
line-height: 1.05;
margin-bottom:3px;
color: #fff;
max-width:80%;
text-shadow:0 4px 24px rgba(0,0,0,.35);
animation:fadeUp .9s ease;
}
.slide-subtitle {
color: #fff;
font-size:25px;
line-height: 1.7;
max-width: 80%;
font-weight: 700;
animation:fadeUp 1.2s ease;
}
.prefix_txt {
display: inline-flex;
width: auto;
border: 1px solid #fff;
padding: 0 9px;
color: #fff;
font-size: 25px;
margin-bottom: 20px;
animation:fadeDown 1.2s ease;
}
.cstm_image {
position: absolute;
z-index: 10;
animation:fadeDown 1.2s ease;
}

.horiz-left{
align-items:flex-start;
text-align:left;
}
.horiz-center{
align-items:center;
text-align:center;
}
.horiz-right{
align-items:flex-end;
text-align:right;
}
.vert-top{
justify-content:flex-start;
}
.vert-center{
justify-content:center;
}
.vert-bottom{
justify-content:flex-end;
}
.slide-button {
display:  inline-flex;
width: auto;
font-size: 15px;
/*align-items: center;
justify-content: center;*/
/*height: 52px;*/
padding:9px 25px;
margin-top: 25px;
background: var(--c-main);
color: #fff;
transition:
    transform .25s ease,
    background .25s ease;
animation:
    fadeUp 1.4s ease;
}
.slide-button:hover {
transform: translateY(-2px);
color: #000;
}
.swiper-pagination {
text-align: right !important;
padding-right: 25px;
}
.swiper-pagination-bullet {
background: var(--swiper-pagination-bullet-inactive-color,#fff) !important;
opacity: var(--swiper-pagination-bullet-inactive-opacity,.4) !important;
/*height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));
width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));*/
}
.swiper-pagination-bullet-active {
opacity: 1 !important;
background: var(--c-main) !important;
}
.swiper-button-prev,
.swiper-button-next {
width:40px;
height:40px;
padding:5px;
/*border-radius: 50%;
background: rgba(255,255,255,.14);
backdrop-filter: blur(8px);*/
color: var(--c-main);
opacity: 0.5;
/*outline: 1px pink solid;*/
}
.swiper-button-prev:hover,
.swiper-button-next:hover {
opacity: 1.0;
}
/*.swiper-button-prev::after,
.swiper-button-next::after {
font-size:9px;
}*/
.swiper-button-prev {margin-left:10px !important;}
.swiper-button-next {margin-right:10px !important;}
/*SPECIAL*/
/*
|--------------------------------------------------------------------------
| SHUTTER BACKGROUND
|--------------------------------------------------------------------------
*/
.slide-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 1;
}
.slide-bg-image {
    position: absolute;
    inset: -5%;
    background-size: cover;
    background-position: center;
    transform: scale(1);
    transition:
        transform 2.5s ease,
        clip-path 1.8s ease;
    will-change:
        transform,
        clip-path;

    clip-path:
        inset(0 0 0 0);
}
/*
|--------------------------------------------------------------------------
| ACTIVE SLIDE
|--------------------------------------------------------------------------
*/
.swiper-slide-active .slide-bg-image {
    transform: scale(1.08);
    clip-path:
        inset(0 0 0 0);
}
/*
|--------------------------------------------------------------------------
| PREV/NEXT SLIDES
|--------------------------------------------------------------------------
*/
.swiper-slide-prev .slide-bg-image {
    clip-path:
        inset(0 100% 0 0);
}
.swiper-slide-next .slide-bg-image {
    clip-path:
        inset(0 0 0 100%);
}


@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* HOMEPAGE */
.sidebar_open{
min-height:495px;
}
.sidebar_open .categories_content{
opacity:1;
visibility:visible;
pointer-events:auto;
}
@media (max-width: 1199px) {
    .sidebar_open .categories_content{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    }
    .sidebar_open:hover .categories_content{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    }
    .sidebar_open ul.categories_content {
    flex: unset;
    }  

}


@media(max-width:991px){
    .swipeslider {
        height: 360px;
    }
    .slide-content {
        width: 80%;
    }
    .slide-title {
        font-size: 34px;
    }
}

@media(max-width:767px){
    .swipeslider {
        height: 260px;
    }
    .slide-content {
        width: 100%;
        padding: 24px !important;
    }
    .slide-title {
        font-size: 26px;
        margin-bottom: 12px;
    }
    .slide-subtitle {
        font-size: 14px;
        line-height: 1.5;
        margin-bottom: 18px;
    }
    .slide-button {
        height: 42px;
        line-height: 42px;
        padding: 0 22px;
        font-size: 14px;
    }

}
@media (max-width: 576px) {
    .slide-content {
    padding:15px !important;
    }
    .swiper-button-prev {
      margin-left: -5px !important;
    }
    .swiper-button-next {
    margin-right: -5px !important;
    }

}
