@charset "utf-8";
/* CSS Document */
                                                                                                                                                                   
/*二级页banner*/
.ej_banner{width:100%;height: auto;overflow: hidden; background: url("../images/home-motorcycle-shop-bg.jpg")no-repeat center top;margin-top: 91px;}
.ej_banner h1{width:100%;height: auto;color: #fff;font-size: 68px;display: block;text-align: center;padding: 60px 0;}
.list_nav{margin-top:40px;display: flex;justify-content: space-between;}
.list_nav_l{width:270px;}
/*CATEGORÍAS*/
.list_nav_l_1,.list_nav_l_2,.list_nav_l_3{border-bottom: 1px solid #e8e8e8; width: 100%; height: auto; overflow: hidden;margin-bottom: 30px;padding-bottom: 30px;}
.list_nav_l_1 .tit{width:100%; height: auto;}
.list_nav_l_1 .tit h2,.list_nav_l_3 .tit h2{font-size: 16px;margin-bottom: 10px;color: #333;font-weight: 600;}
.list_nav_l_1 ul{}
.list_nav_l_1 ul li a{color: #767676;display: flex;justify-content: space-between;}
.list_nav_l_1 ul li {width: 100%;padding: 8px 0; font-size: 13px;cursor: pointer;}
.list_nav_l_1 ul li span,.list_nav_l_3 ul li span{
	padding-inline: 5px;
    min-width: 30px;
    height: 20px;
    border: 1px solid #767676;
    border-radius: 35px;
    color: #767676;
    text-align: center;
    font-size: 12px;
    line-height: 18px;
    transition: color .25s ease, background-color .25s ease, border-color .25s ease;
    flex: 0 0 auto;}
.list_nav_l_1 ul li:hover span,.list_nav_l_3 ul li:hover span{color: #fff;background-color: #ff9933;border-color:#ff9933;}
.list_nav_l_1 ul li:hover a,.list_nav_l_3 ul li:hover a{color:#333;}
.list_nav_l_1 ul li.on a{color:#333;}
.list_nav_l_1 ul li.on span{color: #fff;background-color: #ff9933;border-color:#ff9933;}
.mb_close{display:none;} 




/*3*/
.scroll_box1{width: 100%;height: 280px;position: relative;overflow: hidden;}
.scroll_cont{width: 100%;height:auto;}
.list_nav_l_3 ul{width: 100%;height:auto;}
.list_nav_l_3 ul li {width:calc(100% - 10px);padding: 8px 0; font-size: 13px;cursor: pointer;}
.list_nav_l_3 ul li a{color: #767676;display: flex;justify-content: space-between;align-items: center;}
.list_nav_l_3 ul li .has_img{width:auto;height: auto; display: flex;align-items: center;}
.list_nav_l_3 ul li .has_img img{width:55px;height: auto; display: flex;align-items: center;margin-right:10px;}
.zUIpanelScrollBox{width: 1px;background: red;}
.list_nav_l_3 ul li i{display: inline-block;width: 25px;height: 25px;border-radius: 50px;margin-right: 10px;position: relative;}
.yellow{background: #eeee22;}
.zs{background: #c98d00;}
.ls{background: #1e73be;}
.list_nav_l_3 ul li i:after{height: 2px; display: inline-block;content: ''; background: #242424;position: absolute;bottom: -4px;left: 0px;}
.list_nav_l_3 ul li:hover i::after{width:100%;}
.cio{color: #767676; font-size: 12px;}
.Filtrar_btn{display: inline-block;background: #f7f7f7;border-radius: 5px;padding: 8px 14px;font-size: 12px; color: #333; position: absolute;right: 0px;top:60px;cursor: pointer;}
.hd_k{position: relative;}
.Filtrar_btn:hover{background:#efefef;}



/*产品列表*/
.slideTxtBox{width:920px; height: auto;margin-top: 30px;}
.slideTxtBox ul{width:100%; height: auto;display: flex;flex-wrap: wrap;}
.slideTxtBox li{width: 275px; height: auto;  margin-bottom: 30px;margin-left:30px;}
.gwc_li{width:100%; height: auto;position: relative;}
/*2圈*/
.product-labels { position: absolute; top: 7px;inset-inline-start: 7px;z-index: 1;display: flex;align-items: flex-start;
 flex-direction: column;gap: 10px; max-width: 50%;transition: all .3s ease;transform: translateZ(0);}
.product-label { min-width: 50px;color: #fff;text-align: center;text-transform: uppercase;word-break: break-all; font-weight: 600; font-size: 12px;
line-height: 1.2;}
.product-labels.labels-rounded .product-label {display: flex;align-items: center;justify-content: center; min-height: 50px; border-radius: 35px;
font-size: 14px;}
.product-label.onsale {background-color:#ff9933; direction: ltr;}
.product-label.featured {background-color: #E22D2D;}
/*table_img*/
.img_change{width:100%; height:186px; position: relative; overflow: hidden;}
.img_c_img {width:100%; height: auto;position:absolute; top: 0px;}
.img_c_img img{width:100%; height: auto;}
.img_c_btn{width:100%; height: auto; display: flex;justify-content: center; align-items: center;}
.img_c_btn span i{width:15px; height:15px; display:inline-block; border-radius: 50px;position:relative;}
.img_c_btn span.onn i:after{width:15px; height:2px; display:inline-block; content: ''; background:#242424;position: absolute; bottom: -4px; }
.img_c_btn span{width: auto; position: relative; margin: 5px 5px; cursor: pointer;}
.img_c_btn span sup{width: max-content; position:absolute;color: #fff;display: inline-block;padding: 5px;background:#000000de; top:-35px; left: 50%;transform: translateX(-50%); opacity: 0;transition: all .25s ease;}
.img_c_btn span sup:after{display: block;width: 0;height: 0;position: absolute;bottom: -5px;content: '';left: 50%;transform: translateX(-50%);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #000000de;}
.img_c_btn span:hover sup{opacity: 1;}
.black{background:#000000;}
.red{background:#dd3333;}

.table_{width:100%; height:186px; position: relative;overflow: hidden; }
.gw_car{
	position: absolute;
    inset-inline: 0;
    bottom: 0;
    transition: transform .3s ease, opacity .3s ease;
    transform: translateY(103%) translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 3;
    height: 38px; width: 100%; overflow: hidden;}


.gw_car span{
	display: block;
    font-size: 13px;
    color: #fff; 
    background-color:#ff9933e6;text-align: center; width: 100%; height: 100%; line-height: 38px;position: absolute;
}

.gw_car p{
	display: block;
    background-color:#ff9933;text-align: center; width: 100%; height: 100%; line-height: 38px;display: flex;align-items: center;
    justify-content: center; cursor: pointer;
}

.gw_car p img{
	display: block;
   width: 20px;height: auto;
}

.on_car{bottom: 38px;transition: all .25s ease;}
.on_car:hover span{top:-50%; transform: translateY(-50%) translateZ(0);transition: all .25s ease;}

.gw_car_navlist{width:50px; height: 85%;position: absolute; z-index:20;right:0px; top: 0px; background: #fff;border-right: 1px solid #f3f3f3;transform: translateX(70px);}
.gw_car_navlist ul {width:50px !important; height: 100%;display: flex;flex-direction: column;}
.gw_car_navlist ul li {width:50px !important; height:50px !important;;display: flex; align-items: center;justify-content: center; position: relative;margin-bottom: 0px !important; margin-left: 0px !important;}
.gw_car_navlist ul li img{width:25px; height:25px; margin: 10px 0;}
.on_navlist{transform: translateX(-10px);transition: all .25s ease;}
.gw_car_navlist ul li.sc{position: relative;}
.gw_car_navlist ul li.sc img{position: absolute; top:5px;transform: translateX(-50%); left: 50%;}
.gw_car_navlist ul li.sc a:nth-child(2) img{display: none;}
.gw_car_navlist ul li p{position: absolute; left: -73px;background:#242424; color: #fff; font-size: 12px; padding: 5px; opacity: 0;transition: all .25s ease;}
.gw_car_navlist ul li p:after{display: block;width: 0;height: 0;position: absolute;top:50%;content: '';right:-5px;transform: translateY(-50%);
	 border-top: 5px solid transparent;
    border-left: 5px solid #000000de;
    border-bottom: 5px solid transparent;
   }
.gw_car_navlist ul li:hover p{opacity: 1;}
.on_sc{opacity: 1;transition: all .25s ease;}



/*.gw_car_*/
.gw_car_{width:calc(100% - 20px); height:80%; position: absolute; top: 0; left: 0; padding: 10px;background:#ffffffd1;z-index: 8888;overflow-y: scroll; display: none; padding-bottom: 30px;}
.gw_car_ .close{width:100%; height:auto; text-align: right;cursor: pointer;}
.Color_slect{width:100%; height:auto; text-align:center; margin-top: 20px;}
.Color_slect h2{font-weight:bold; color: #242424;font-size: 12px;margin-bottom: 10px;}
.Color_s_{width:100%; height: auto; display: flex;justify-content: center; align-items: center;}
.Color_s_ span i{width:25px; height:25px; display:inline-block; border-radius: 50px;position:relative;}
.Color_s_ span i:after{width:0px; height:2px; display:inline-block; content: ''; background:#242424;position: absolute; bottom: -4px;left: 0px; }
.Color_s_ span:hover i:after{width:25px; }
.on_b i:after{width:25px !important;}
.Color_s_ span{width: auto; position: relative; margin: 5px 5px; cursor: pointer;}
.Color_s_ span sup{width: auto; position:absolute;color: #fff;display: inline-block;padding: 5px;background:#000000de; top:-35px; left: 50%;transform: translateX(-50%); opacity: 0;transition: all .25s ease;}
.Color_s_ span sup:after{display: block;width: 0;height: 0;position: absolute;bottom: -5px;content: '';left: 50%;transform: translateX(-50%);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #000000de;}
.Color_s_ span:hover sup{opacity: 1;}
.gwc_btn{width:100%;background:#ff9933; color:#fff;font-size: 14px;text-align: center;padding: 10px 0;margin-top: 10px;cursor:pointer;}
.Color_s p{display:none; width: 100%;color: #767676;font-size: 12px;text-align: center;transition: all .25s ease; cursor:pointer;}


.gwc_jg{width: 100%; height: auto;text-align: center;}
.gwc_jg h3{width: 100%; height: auto; font-size: 13px; font-weight: bold; }
.gwc_jg h4{width: 100%; height: auto;color: #a5a5a5; font-size:85%; padding: 5px 0;}
.gwc_jg p{width: 100%; height: auto;display: flex; align-items: center; font-size: 12px;justify-content: center}
.gwc_jg p span{ text-decoration: line-through;color: #a5a5a5; font-size: 10px;}
.org{color:#ff9933;}

.gw_car_{height: 136px;}
.car_scllor{width:93%;}
.gw_car_ .zUIpanelScrollBox,.gw_car_ .zUIpanelScrollBar{width:5px !important;top:0px;right:0px; display: block !important;opacity: 1!important;}
.gw_car_ .zUIpanelScrollBox{background:#f2f2f2;height:140px!important;}
.gw_car_ .zUIpanelScrollBar{background:#d5d5d5;}

/*nav_go*/
.nav_go{width:100%; height: auto; display: flex;justify-content: space-between;align-items: center;}
.nav_go2{width:auto; height: auto; display: flex;justify-content: space-between;align-items: center;}
.nav_go2_1{width:auto; height: auto; display: flex;justify-content: space-between;align-items: center;}
.nav_go2_1 a{color: #767676;font-size: 15px;margin-left:5px; margin-right:5px; cursor: pointer;}
.nav_go2_1 .action{color:#333; }

.nav_go1 a{color: #767676;margin-right: 10px;cursor:pointer;}
.nav_go1 a:nth-child(2){color: #333;font-size: 15px;margin-left: 10px; }
.nav_go1 p{display: none;}

.nav_go2_2{width: auto;display: flex;align-items: center;margin: 0 20px;}
.nav_go2_2 span{font-size:20px;margin: 0 5px;}
.nav_go2_2 span:nth-child(1){font-size:22px;color:#767676;}
.nav_go2_2 span:nth-child(2){font-size:24px;}
.nav_go2_2 span:nth-child(3){font-size:22px; color:#767676; }
.nav_go2_2 span:hover{color: #333;}
.nav_sj{display:none;}


/*selct*/
.nav_go2_3{max-width: 200px;padding-top: 5px;padding-bottom: 5px;transition: border-color .5s ease;height: auto;}
.nav_go2_3 select{
	border-top-style: none;
    border-right-style: none;
    border-left-style: none;
    border-bottom:2px solid #d7d7d7;
    border-radius: 0;
    background-color: unset;
    background-position: right 0 top 50%;
	outline: none;
    color: #242424;
    font-weight: 600;
    font-size: inherit;
    line-height: 1.2;
    padding-bottom:5px;
	color:#767676;
}


select option { background-color:#fff;}


.page{width:100%; display: flex;justify-content: center} 


/*新增切换效果*/
.list_nav_r .bd{width:920px;}
/*slideTxtBox2*/
.slideTxtBox2,.slideTxtBox4{width:100%;margin-top: 30px;}
.slideTxtBox2 ul,.slideTxtBox4 ul{width:100%; display: flex;flex-wrap: wrap;}
.slideTxtBox2 ul li{width:calc(50% - 30px); float: left;margin-left: 30px; margin-bottom: 5%; }
.slideTxtBox2 ul li .img_change{height: 287px;}	
.slideTxtBox2 ul li .table_{height:auto;}
.slideTxtBox2 .car_scllor{height:100%;}
.slideTxtBox2 .gwc_btn{position: absolute;bottom: 40px;}
.slideTxtBox2 .Color_slect{margin-top: 77px;}


.slideTxtBox4 ul li{width:calc(25% - 30px); float: left;margin-left: 30px; margin-bottom: 5%; }
.slideTxtBox4 ul li .img_change{height: 140px;}	
.slideTxtBox4 ul li .table_{height:auto; cursor: pointer;}
.nav_go2_2 span{ cursor: pointer;}
.slideTxtBox2 .gw_car_{height:100%;}
.slideTxtBox2 .gw_car_ .zUIpanelScrollBox{height: auto !important;}
.slideTxtBox4 .gw_car_{height:90px;}








/*mobile 适配*/
@media screen and (max-width:900px){
	.ej_banner{margin-top:60px;}
	.ej_banner h1{padding:20px 0; font-size:30px; font-weight: bold;}
	
	.list_nav{flex-direction: column;}
	.list_nav_l{ position: fixed; top: 0px;left: 0px;background: #fff; z-index:999999;width:80vw;transform: translate3d(-100%, 0, 0);transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); height: 100vh;}
	.slideTxtBox{width:100%;}
	
	/*nav*/
	.nav_go2,.nav_go1 span,.nav_go1 a:nth-child(3){display: none;	}
	.nav_go1 p{display:block; color: #777777; font-size: 12px;}
	.nav_go1 {display:flex;justify-content: space-between;align-items: center; width: 100%; border-bottom: 1px solid #ebebeb; padding-bottom: 10px;}
	.nav_go1 a{color: #333;font-weight:400;}
	.nav_sj{display:block; width: 100%; margin-top: 20px;display: flex;align-items: center;justify-content: space-between;}
	.nav_go{flex-direction: column;}
	.nav_sj_cd{width: auto; display: flex;align-items: center}
	.nav_sj_cd img{width:15px;height: auto; margin-right:5px;}
	.nav_sj_cd p{font-size: 12px;color: #333;font-weight: 600;}
	.mb_close{display: block;display: flex;align-items: center;justify-content: flex-end; color:#767676;border-bottom: 1px solid #ebebeb;padding: 20px 0; padding-right: 10px;} 
	.mb_close p{font-size: 15px; margin-right: 10px;} 
	.list_nav_l_1,.list_nav_l_3{padding:30px;width: calc(100% - 60px); margin-bottom: 0px;}
	.list_nav_l_1 ul li span, .list_nav_l_3 ul li span{padding:0px;height: auto;line-height: 14px;}
	.list_nav_l_1 .tit h2, .list_nav_l_3 .tit h2{font-size:14px;}
	.list_nav_l_1 ul li{font-size:12px;padding: 6px 0;}
	.mb_scrll{height:calc(100vh - 40px);overflow-y: scroll; }
	.scroll_box1{}
	
	/*购物车切换*/
	.slideTxtBox ul li{font-size: 14px;margin-right:0px;margin-left: 0px;}
	.slideTxtBox ul{justify-content: space-between;}
	.slideTxtBox  li{width:48%; margin-right: 0px; margin-bottom: 5%;}
	.product-labels.labels-rounded .product-label{min-width:40px; min-height:40px;font-size:10px;gap: 5px }
	/*show*/
	.gw_car{display: block !important;transform: translateY(0) translateZ(0);bottom:0px;}
	.gw_car span{display:none !important;}
	.gw_car p{width:40px; height: 40px;background-color:#ff9933b5; }
	.table_,.img_change{height:120px;}
	.gw_car_navlist{display: block !important;transform: translateX(0px);height: auto;border-radius: 50px;border-bottom: 3px solid #f3f3f3;}
	.gw_car_navlist ul li:nth-child(1){display:none; }
	.gw_car_navlist ul li{width:35px !important;height: 35px!important; border-radius: 50px;}
	.gw_car_navlist ul li img{width:15px;height: auto;margin: 0;top:10px !important; }
	.gw_car_navlist ul,.gw_car_navlist{width:35px !important;}
	.gwc_jg h3{font-size: 11px;}
	.gwc_jg p{font-size:10px;}
	
	/*新增*/
	.list_nav_r .bd{width:100%;}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
}


.mobile-search-results {
	max-height: 400px;
	overflow-y: auto;
	background: #fff;
	box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.search-result-item {
	padding: 10px;
	border-bottom: 1px solid #eee;
	display: flex;
	align-items: center;
}

.search-result-item img {
	width: 60px;
	height: 60px;
	margin-right: 15px;
	object-fit: cover;
}

.search-result-item h4 {
	margin: 0;
	font-size: 14px;
	color: #333;
}

.search-result-item p {
	margin: 5px 0 0;
	color: #e4393c;
	font-weight: bold;
}


.product-row {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	gap: 15px;
	margin-bottom: 20px;
}

.product-item {
	text-align: center;
	border: 1px solid #eee;
	padding: 10px;
}

.product-item img {
	max-width: 100%;
	height: auto;
}

.price {
	color: #ff4444;
	font-weight: bold;
}

/* 响应式处理 */
@media (max-width: 1200px) {
	.product-row {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 768px) {
	.product-row {
		grid-template-columns: repeat(2, 1fr);
	}
}