/* BASIC css start */
/* BASIC css start */
/* BASIC css start */

.brand_detail{ width: 100%; height: 100px;margin-top: 10px;}
.brand_detail ul{ padding: 7px;}
.brand_detail li img{ width: 85px; height: 85px; float: left; margin-right: 10px;}
.brand_detail li h3{font-size: 20px;margin-bottom: 25px;font-weight: bold;}
.brand_detail li p{font-size: 9px;letter-spacing: -1px;line-height: 15px;}

.brand_detail_1 { width: 100%; height: 100px; margin-top: 10px;}
.brand_detail_1 ul{ padding: 7px;}
.brand_detail_1 li img{ width: 85px; height: 85px; float: left; margin-right: 10px;}
.brand_detail_1 li h3{font-size: 20px; margin-bottom: 10px; font-weight: bold;}
.brand_detail_1 li p{font-size: 10px;}
.brand_detail_1 li .title_bottom{ margin-bottom: 4px;}
.brand_detail_1 .brand_Btn a{ border: 1px solid gray; font-size: 10px; padding: 5px 15px;}
.brand_sub_title {margin: 10px auto 0;text-align: center;font-size: 20px;}F
.brand_sub_title h3{font-weight: bold;}
.sort .ea strong { font-size:13px; font-weight:800;}
.sort .ea { font-size:12px; font-weight:300; line-height:40px; text-align:left; padding-left: 15px;top: -36.5px; position: relative;width: 70%; }

.view_more_btn{ position: relative; bottom:0; left:0; right:0;  text-align: left;/* margin: 0 22px; */color: rgb(228, 228, 228);margin-top: 5px;}
.view_more_btn span{
    /* width: 80%; */
    margin:0 auto;
    display:inline-block;
    padding: 0px;
    /* border: 1px solid #cccccc; */
    /* background:#fff; */
    /* color: #161616; */
    font-size: 14px;
    cursor:pointer;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid;
    }

.view_more_btn span:before{content:'´õº¸±â';}
.view_more_btn.open span:before{content:'Á¢±â';}
.view_more_btn span:hover {
    /* background: #000; */
    /* color: #fff; */
}

.view_more_btn_2{ position: relative; bottom:0; left:0; right:0;  text-align: right; margin: 0 2%;}
.view_more_btn_2 span{
    border-radius: 20px;
    margin:0 auto;
    display:inline-block;
    padding: 5px 10px;;
    color: #fff;
    background: #161616;
    font-size: 13px;
    cursor:pointer;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid;
    }

.view_more_btn_2 span:before{content:'´õº¸±â ¡é';}
.view_more_btn_2.open span:before{content:'Á¢±â ¡è';}
.view_more_btn_2 span:hover {
    /* background: #000; */
    /* color: #fff; */
}

.brand_detail_2_txt_1 {display: none;}
.brand_detail_2_txt_1.view_all {display: block;}
.item-top .view_all {height: 100%;}

.brand_detail_2 {
    background-image: url(/design/mdceline/stylish/m_images/brand_detail_2_img.jpg);
    position: relative;
    z-index: 1;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    box-sizing: border-box;
    /* min-width: 1000px; */
    /* min-height: 600px; */
    padding: 40px 0px 40px 0px;
    background-position: 50% 50%;
    background-size: cover;
}

.brand_detail_2::after {
    content: "";
    position: absolute;
    inset: 0px;
    background-color: rgba(0, 0, 0, 0.5);
}

.brand_detail_2_txt_box {
    display: flex;
    margin: 0 22px;
    z-index: 10;
}

.brand_detail_2_txt_box h3 {
    width: 100%;
    box-sizing: border-box;
    /* padding-right: 44px; */
    font-size: 13px;
    font-weight: 500;
    color: #ffffff;
}

.brand_detail_2_tit {
    width: 100%;
    box-sizing: border-box;
    font-weight: 600;
    font-size: 36px;
    line-height: 38px;
    word-break: keep-all;
    overflow-wrap: break-word;
    margin-top: 10px;
    color: #ffffff;
}

.brand_detail_2_txt {
    margin-top: 10px;
}

.brand_detail_2_txt p {
    --desc-line-height: 22px;
    /* --line-clamp-size: 2; */
    font-size: 14px;
    color: rgb(228, 228, 228);
    line-height: var(--desc-line-height);
}

.swiper-container {
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.swiper-container-no-flexbox .swiper-slide {
    float: left;
}

.swiper-container-vertical>.swiper-wrapper {
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;
    transition-property: transform;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate(0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.swiper-container-multirow>.swiper-wrapper {
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -ms-fles-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -ms-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-wp8-horizontal {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.swiper-wp8-vertical {
    -ms-touch-action: pan-x;
    touch-action: pan-x
}
.bestPrd .swiper-button-next, 
.bestPrd .swiper-button-prev {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 11px;
    height: 20px;
    margin-top: -55px;
    z-index: 10;
    cursor: pointer;
    -moz-background-size: 11px 20px;
    -webkit-background-size: 11px 20px;
    background-size: 11px 20px;
    background-position: center;
    background-repeat: no-repeat
}

.bestPrd .swiper-button-next.swiper-button-disabled,
.bestPrd .swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.bestPrd .swiper-button-prev,
.bestPrd .swiper-container-rtl .swiper-button-prev {
    background-image: url("/design/mdceline/stylish/m_images/prd_slide_arr_l.png");
    left: 17px;
    right: auto
}


.bestPrd .swiper-button-next, 
.bestPrd .swiper-container-rtl .swiper-button-next {
    background-image: url("/design/mdceline/stylish/m_images/prd_slide_arr_r.png");
    right: 17px;
    left: auto
}

.swiper-pagination {
    position: relative;
    text-align: center;
    -webkit-transition: 300ms;
    -moz-transition: 300ms;
    -o-transition: 300ms;
    transition: 300ms;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-pagination-bullet {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 100%;
    background: #aeaeae;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer;
}

.swiper-pagination-white .swiper-pagination-bullet {
    background: #fff;
}

.swiper-pagination-bullet-active {
    background: #000;
}

.swiper-pagination-white .swiper-pagination-bullet-active {
    background: #fff;
}

.swiper-pagination-black .swiper-pagination-bullet-active {
    background: #000;
}

.swiper-container-vertical>.swiper-pagination {
    right: 10px;
    top: 50%;
    -webkit-transform: translate3d(0, -50%, 0);
    -moz-transform: translate3d(0, -50%, 0);
    -o-transform: translate(0, -50%);
    -ms-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0)
}

.swiper-container-vertical>.swiper-pagination .swiper-pagination-bullet {
    margin: 5px 0;
    display: block;
}

.swiper-container-horizontal>.swiper-pagination {
    width: 100%;
    padding: 0 0 15px;
    transition: none !important;
}

.swiper-container-horizontal>.swiper-pagination .swiper-pagination-bullet {
    margin: 0 4px;
}

.swiper-container {
    width: 100%;
    height: 100%;

}

.swiper-slide {
    text-align: center;
    font-size: 0px;
    background: #fff;
    /* Center slide text vertically */
    /*display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;*/
}
/*
.swiper-slide a {
    display: inline-block;
    width: 100%;
}
*/
.swiper-slide a img {
    width: 100%;
}


.swiper-container .arrow { 
    opacity: 1; 
}
 

.swiper-video {
    position: absolute;
    left: 0;
    top: 0;
}







.cate-top {}

.cate-top img {
    width: 100%;
}

.mainTitle {
    text-align: center;
    position: relative;
    padding: 20px 0 10px;
}

.mainTitle h3 {
    color: #272727;
    font-size: 18px;
    font-weight: 700;
    font-family: 'Kumbh Sans', sans-serif;
    text-align: left;
    /* margin-bottom: 10px; */
    /* padding: 0px 20px; */
    /* font-size: 18px; */
    /* font-weight: 600; */
    /* line-height: 26px; */
    margin-left: 10px;
}

.item-top {
    position: relative;
    margin: 0 auto;
    text-align: center;
    padding: 10px 0 10px 0;
    font-size: 0;
}
.cate-wrap {
    width: 100%;
    display: block; 
}

.class-list {
    border-top: 1px solid var(--ruler-semantic-color-border-divider);
    padding: 10px 0 0 0;
    overflow: hidden;
    height: 40px;
}

.class-list ul {
    font-size: 0;
    
    
}


.class-list ul li {
    width: 30%;
    height: 30px;
    vertical-align: middle;
    margin: 5px 5px 5px 5px;
    text-align: center;
    background-color: white;
    border: 2px solid #f4f4f4;
    box-sizing: border-box;
    float: left;
}

.class-list ul li .li-category{
    width: 100%;
}

.class-list ul li a {
    color: #292929;
    position: relative;
    font-size: 11px;
    font-weight: 600;
    margin: 0 0 0 0;
    line-height: 26px;
    letter-spacing: -1.1px;
    padding: 0 0 0 0;
}
.class-list ul li a:hover {color:#000000;}
.class-list ul .on{
    width: 30%;
    height: 30px;
    border: 2px solid black;
    box-sizing: border-box;
}
.class-list ul li.on a {
    color: #000;
    font-weight: bold;
    line-height: 30px;
    width: 30%;
    height: 30px;
}
.class-list ul li.on a:after {
    content: "";
    
    width: 4px;
    height: 4px;
    position: absolute;
    top: -5px;
    right: -5px;
    border-radius: 5px;
}
.item-top .sort {
    text-align: right;
    padding-right: 13px;
    padding-top: 15px;
    margin-bottom: -30px;
}

.item-top .sort select {
    /* font-family: 'InfinitySans-RegularA1'; */
    /* height: 27px; */
    border: 0;
    outline: 0;
    background: url(/design/mdceline/stylish/m_images/sort_bg.png) white right center no-repeat;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    /* padding: 0 20px 0 10px; */
    color: #898989;
    font-size: 11px;
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 5px;
    font-weight: 400;
    width: 82px;
    background-size: 7px;
    /*margin-top: 40px;*/
}

.item-top .sort select:hover {
    border: 0;
    color: #555;
}

.item-top .sort select::-ms-expand {
    display: none;
}
.bestPrd {
    padding: 0 10px;
    position: relative;
}
.bestPrd .list {
    margin-left: 0;
    padding-bottom: 0;
    width: 100%;
} 
.bestPrd .list .desc {
    margin-left: 0;
}

.list {
    width: 50%;
    margin-left: 0;
}

.list .desc {
    margin-top: 10px;
    text-align: left;
    margin-left: 12px;
    margin-right: 10px;
}

.list .thumb .my-wish-list {
    position: absolute;
    bottom: -28px;
    right: 10px;
}

.list .thumb .my-wish-list img{
    width: 15px;
}


.list .desc ul .soldout {
    padding-top: 3px;
}
.label_txt {
    padding: 1px 6px;
    border-radius: 1px;
    background: #f4f4f4;
    font-size: 10px;
    color: #1d1d1d;
    display: inline-block;
}

.bf_cont { position: relative; width: 100%; }
.bf_cont img { max-width: 100%; }

.sub_cont { position: relative; width: 100%; }
    
.best_cont { width: auto; padding: 3% 5%; background-image: linear-gradient(-138deg, #04d8ed 0%, #59e6f7 100%); }
.bestBox { overflow: hidden; text-align: center; }
.bestBox p { position: relative; float: left; width: 37%; padding: 15px 6.5%; font-size: 17px; line-height: 19px; font-weight: 700; letter-spacing: -1px; text-align: left; color: #ffffff;}
.bestBox p:nth-child(1), .bestBox p:nth-child(2) { border-top: 0; }
.bestBox p:nth-child(1), .bestBox p:nth-child(3) { border-right: 1px solid #ffffff; margin-left: -1px; }
.bestBox span { display: block; padding-bottom: 5px; font-size: 12px; line-height: 16px; color: #ffffff; letter-spacing: normal; }

.prd-name-sub {
    /* border-top: 1px solid #eaeaea; */
    color: #979797;
    font-size: 11px;
    line-height: 14px;
    /* margin-top: 5px; */
    /* padding-top: 7px; */
    font-weight: normal;
    letter-spacing: -.5px;
    display: none;
}

.category-box { display: block; margin-bottom: 0px; border-top: 1px solid #dfdfdf; }
.category-box ul { overflow: hidden; /* background: url(/design/mdceline/stylish/cate_line_bg.gif) repeat-x bottom; */ }
.category-box li { position: relative; width: 33.3%; float: left; text-align: center; border-bottom: 1px solid #dfdfdf; height: 35px; }
.category-box li a { height: 35px; line-height: 35px; display: block; border-right: 1px solid #dfdfdf; font-size: 13px; font-weight: 600; color: #666; }
.category-box li a.active { font-weight:600; color: #000; background: #efefef; }
.category-box li:nth-child(3n) a { border-right: 0px; }
.category-box li:nth-child(2) a { color: #ff585d; font-weight: 700; }
.category-box li:nth-child(3) a { color: #5e96ff; font-weight: 700; }
.category-box li:nth-child(4) a { color: #bad200; font-weight: 700; }
/*.category-box li:nth-child(5) a { color: #fac300; font-weight: 700; }*/
.category-box li:nth-child(6) a { }
/*
.category-box li:nth-child(7) a { color: #ff99ef; }
.category-box .active.active_none { background: #ffffff; }
.active.active_none { font-weight:normal !important; color: #666 !important; }
.active.active_none:after { display: none; }

.category-box li:nth-child(3) a.active:after { background-color: #ff6d44; }
.category-box li:nth-child(3) a:after,
.category-box li:nth-child(4) a:after { content: ""; width: 6px; height: 6px; background: #ff6d44; border-radius: 50%; display: inline-block; position: absolute; top: 10px; margin-left: 2px; }
*/

.txtcon1 {
    display: table;
    padding: 1px 4px;
    border-radius: 3px;
    margin-bottom: 3px;
    border: 1px solid #eb5e3e;
    color: #eb5e3e;
}

.txtcon8 {
    display: table;
    padding: 1px 4px;
    border-radius: 1px;
    margin-bottom: 3px;
    color: rgb(29, 29, 29);
    background-color: rgb(244, 244, 244);
    font-weight: 700;
    font-size: 10px;
    
}
/*
.txtcon2 {
    display: table;
    padding: 1px 4px;
    border-radius: 3px;
    margin-bottom: 3px;
    border: 1px solid #0046ff;
    color: #ffffff;
    background-color: #0046ff;
    font-weight: 800;
    
}

.txtcon3, .txtcon4, .txtcon5, .txtcon6, .txtcon7 {
    display: table;
    padding: 1px 4px;
    border-radius: 3px;
    margin-bottom: 3px;
    border: 1px solid #00ac0c;
    color: #00ac0c;
    font-weight: 800;
}


.txtcon3, .txtcon4, .txtcon5, .txtcon6, .txtcon7{display: none;}

*/


.class-list ul {
    flex-wrap: wrap;
    padding: 0 2%;
    display: flex;
}


.class-list ul li {
    position: relative;
    display: inline-flex;
    height: 30px;
    line-height: 30px;
    font-size: 13px;
    font-weight: 400;
    margin: 0 5px 14px 0;
    border: 1px solid #f4f4f4;
    border-radius: 20px;
    background: #f4f4f4;
    color: #777;
    width: auto;
}
.class-list ul li a {
    position: relative;
    display: inline-flex;
    height: 30px;
    line-height: 30px;
    font-size: 13px;
    font-weight: 400;
    margin: 0 0px 14px 0;
    border: 1px solid #f4f4f4;
    border-radius: 20px;
    padding: 0 10px;
    background: #f4f4f4;
    color: #777;
}
.class-list ul li a .li-category{width: 100%;}
.class-list ul li a:hover {color:#000000;}
.class-list ul .on{
    position: relative;
    background: #000;
    color: #fff;
    border: 1px solid #000;
    width: auto;
}
.class-list ul li.on a {
    position: relative;
    background: #000;
    color: #fff;
    border: 1px solid #000;
    width: auto;
}
.bestPrd .MK-product-icons img {padding:0 2px 0 0;padding-right: 3px;padding-bottom: 3px;width: auto !important;height: 20px !important;padding-top: 3px;}
.MK-product-icons img {padding:0 2px 0 0;padding-right: 3px;padding-bottom: 3px;width: auto !important;height: 20px !important;}

.list .desc ul .prdicon {
    padding-top: 0px;
}

.list .thumb .num {
    width: 20px;
    height: 20px;
    background: #111111;
    position: absolute;
    top: 175px;
    left: 5px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    border-radius: 20px;
    font-weight: 700;
    font-family: 'Kumbh Sans', sans-serif;
    font-size: 10px;
}

.list .thumb .num {
    position: absolute;
    z-index: 100;
    top: 0px;
    left: 0px;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-size: 13px;
    font-weight: 700;
    color: rgb(255, 255, 255);
    background-color: rgb(0, 0, 0);
    border-radius: 0px;
}

.catalog {
    padding: 10px;
}

.catalog_box {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.catalog_box_1 {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 25%;
}

.catalog_t_box {
    position: absolute;
    z-index: 1;
    inset: 0px;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.15);
}

.catalog_t {
    position: absolute;
    z-index: 1;
    padding-top: 2px;
    font-size: 24px;
    font-weight: 700;
    color: rgb(255, 255, 255);
}

.catalog_img {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
}
/* BASIC css end */

