/* BASIC css start */
.depth_wrap{}
.depth_wrap .page_location {  display: flex; align-items: center; border-top: 1px solid #E2E2E2; border-bottom: 1px solid #E2E2E2; padding: 0 30px;  margin-bottom: 60px; }
.depth_wrap .page_location .SMScategoryName { width: 104px;}
.depth_wrap .page_location .cate2_name{display: flex; align-items: center; }
.depth_wrap .page_location .cate2_name li{  padding: 10px 16px; display: inline-block; }
.depth_wrap .page_location .cate2_name li a.eng{ font-size: 15px;}
.depth_wrap .page_location .cate2_name li a.on{ border-bottom: 1px solid #000; font-weight: 500;}

.eventBanner{ width: 100%; margin: -60px 0 20px;}

.list_desc_box{ }
.list_desc_box .SMS_Category_list{ margin-bottom: 40px;}
.list_desc_box .SMS_Category_list .CateInBody{}
.list_desc_box .SMS_Category_list .CateInBody ul{ display: flex; align-items: flex-end; justify-content: center;}
.list_desc_box .SMS_Category_list .CateInBody ul li a{ margin: 0 10px; display: block; text-align: center; font-size: 15px;}
.list_desc_box .SMS_Category_list .CateInBody ul li a :is(div, p, span){display: flex; align-items: center; justify-content: center;  border-radius: 80px; text-align: center; }
.list_desc_box .SMS_Category_list .CateInBody ul li a p{width: 74px; height: 74px; margin-bottom: 20px; background: #F6F6F6; position: relative;}
.list_desc_box .SMS_Category_list .CateInBody ul li a p img{ width: 80%;}
.list_desc_box .SMS_Category_list .CateInBody ul li a span{ background: #f6f6f6; width: 100%; height: 100%; color: #000;}
.list_desc_box .SMS_Category_list .CateInBody ul li a.sel p::after{ display: block; content: ""; position: absolute; left: -6px; top: -6px; width: calc(100% + 10px); height: calc(100% + 10px); border: 1px solid #000; border-radius: 100px;}

.list_desc_box .shopbrandTitle{ text-align: center; font-size: 18px; line-height: 1.5; margin-bottom: 50px;}


.sort_area{ display: flex; align-items: center; margin-bottom: 20px; padding: 0 30px;}
.sort_area li{margin-right: 10px;}
.sort_area li a{display: block; padding: 8px 12px; background: #EFEFEF; border-radius: 50px;}
.sort_area li a.active{ background: #000; color:#fff;}

.page-body{ padding: 0 30px;}



/* class-list */
#productClass .cate-wrap { overflow:hidden }
#productClass .cate-wrap .bcate { padding-bottom:10px; font-size:18px; color:#202020; font-weight:bold; border-bottom:1px solid #e3e3e3 }
#productClass .cate-wrap .class-list ul { border-bottom:1px solid #e3e3e3;  *zoom:1 }
#productClass .cate-wrap .class-list ul:after { display:block; clear:both; content:'' }
#productClass .cate-wrap .class-list ul li { padding:15px 30px 16px 0; float:left }
#productClass .cate-wrap .class-list ul li a { display:block; font-size:13px; color:#919191 }


/* best-item */
#productClass .best-item { padding-top: 20px; padding-bottom: 10px; border-top: 2px solid #5c5c5c; border-bottom: 2px solid #5c5c5c; background-color: #f8f8f8; }

/* total-sort */
#productClass .total-sort { padding-top: 30px; }


.shopbrandTitle .bf_popup { display:none; position: fixed; top:50%; left:50%; transform: translate(-50%, -50%); z-index:15; width:500px; }
.shopbrandTitle .bf_popup img{width:100%; border: 1px solid rgba(0, 0, 0, 0.1);}
.shopbrandTitle .bf_popup .bf_popup_close { position: absolute; right:0; top:0; width:80px; height: 80px; z-index:1;}


.collection p{font-size:15px;}
.collection a{margin-top:16px; padding:5px 14px; border:solid 1px #000; display:inline-block; border-radius:14px;}
.collection a > img{width: 6px; margin-top: 3px; margin-left: 3px;}

.SMS_Category_list.collection_category{border-bottom:solid 1px #E2E2E2; margin:0 30px 40px; position:relative;}
.SMS_Category_list.collection_category > span{font-size:20px; font-weight:500; display:block; margin-bottom:20px;}
.SMS_Category_list.collection_category > a{position:absolute; right:0; top:0; font-size:14PX; font-weight:400; color:#a2a2a2;}
.SMS_Category_list.collection_category > a img{filter: invert(58%) sepia(98%) saturate(0%) hue-rotate(152deg) brightness(95%) contrast(82%); width: 6px; margin-top: 3px; margin-left: 4px;}
.SMS_Category_list.collection_category .CateInBody ul{display:flex; justify-content: flex-start;}
.SMS_Category_list.collection_category .CateInBody ul li a{padding: 0 0 15px; margin: 0 10px; font-size: 15px; display: inline-block; text-align: center;}
.SMS_Category_list.collection_category .CateInBody ul li:first-child a{margin-left:0;}
.SMS_Category_list.collection_category .CateInBody ul li a.sel{font-weight: 600; position: relative; border-bottom: 1px solid #000;}

.collection_box{padding:0 30px; display:flex; flex-wrap: wrap; justify-content: flex-start; margin:100px 0;}
.collection_box img{width:calc((100% - 40px)/5); margin-bottom:10px; margin-right:10px; cursor:pointer}
.collection_box img:nth-child(5n){margin-right:0;}

.collection_main{}
.collection_main > p{font-size:24px; font-weight:500; text-align:center; padding-top:40px;}
.collection_main .collection_con{padding-top:100px; padding-bottom:164px; border-bottom:solid 1px #e2e2e2;}
.collection_main .collection_con:last-child{border-bottom:0}
.collection_main .collection_con .swiper-slide img{width:100%;}
.collection_main .collection_con .swiper-scrollbar{width:calc(100% - 60px); bottom:160px; background:#e2e2e2; left:50%; transform:translateX(-50%); border-radius:0;}
.collection_main .collection_con .swiper-scrollbar .swiper-scrollbar-drag{background:#000; border-radius:0;}
.collection_main .collection_con > span{position:absolute; left:30px; bottom:100px; font-size:20px; font-weight:500;}
.collection_main .collection_con > a{position:absolute; right:30px; bottom:100px; font-size:16px; font-weight:400;}
.collection_main .collection_con > a img{width: 7px; margin-top: 4px; margin-left: 4px;}

.collection_popup{position:fixed; top:0; left:0; width:100%; height:100%; background:#fff; z-index:99; padding:50px 30px; overflow:hidden;}
.collection_popup .close{width:21px; height:21px; float:right; cursor:pointer;}
.collection_popup .close img{width:100%;}
.collection_popup .collectionPopupSwiper{overflow:hidden; width:100%; height:100%; padding-top:20px;}
.collection_popup .collectionPopupSwiper .swiper-button-prev{left:0;}
.collection_popup .collectionPopupSwiper .swiper-button-next{right:0;}
.collection_popup .collectionPopupSwiper .swiper-button-prev::after{font-size:0; width:15px; height:30px; background-image:url(/design/jmomall/ECHO/uiux/icon/arrow_left.svg); background-size:contain; background-repeat:no-repeat; background-position:center;}
.collection_popup .collectionPopupSwiper .swiper-button-next::after{font-size:0; width:15px; height:30px; background-image:url(/design/jmomall/ECHO/uiux/icon/arrow_right.svg); background-size:contain; background-repeat:no-repeat; background-position:center;}
.collection_popup .collectionPopupSwiper .swiper-slide{text-align:center;}
.collection_popup .collectionPopupSwiper .swiper-slide img{width:auto; height:100%;}

.prd-benefit{width:25%;}


/* BASIC css end */