﻿ body{background:var(--light);}

.fixed-bg{position:absolute; top:0; left:0; z-index:1;  width:100%; height: calc(80px * var(--device));}

.bg-color-ry{height: calc(80px * var(--device));position: absolute;top: 0;left: 0;width: 100%;z-index: 1;}
.bg-color-ry2{position: absolute;z-index: 1;top: calc(40px * var(--device));height: calc(50px * var(--device));left: 0;width: 100%;}

.line-search{position:relative;z-index:1;padding-top:calc(10px *  var(--device));}
.line-search-rq{position:relative;z-index:2;}
.kj-input{background:#fff; border:0px;}

.index-rq1{position: relative;background: #0E5DC4}
.index-rq1-bg{position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 1;background-image: linear-gradient(45deg, rgba(209, 0, 42, 0.6) 0%, #0E5DC4 100%);opacity: 0.9;}
.index-rq1-bg-img{position: absolute;right: calc(20px * var(--device));bottom: calc(10px * var(--device));opacity: 0.75}
.index-rq1-word{position: relative;z-index: 2;color: #fff;}

#index-banner{overflow: hidden;}
#index-banner.swiper-container{height:calc(680px * var(--device));}
#index-banner .swiper-slide img{width: 100%;height: 100%;position: absolute;top: 0;left: 0;}
#index-banner .swiper-pagination-bullet{width: calc(20px * var(--device));height: calc(20px * var(--device));margin: 0 calc(6px * var(--device))}
#index-banner .swiper-pagination{bottom: calc(0px * var(--device))}
#index-banner .swiper-pagination-bullet-active{background-color: var(--orange)}
#index-banner .swiper-slide .swiper-bg{position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 2;background-image: linear-gradient(-45deg, rgba(209, 0, 42, 0.6) 0%, #0E5DC4 100%);opacity: 0.75;}
#index-banner .swiper-word{position:absolute; top: 0;left: 0;right: 0;bottom: 0;z-index:3; color:#fff; text-align:center;}
#index-banner .swiper-word .w-1{text-transform:uppercase; font-size: calc(20px * var(--device)); }
#index-banner .swiper-word .w-2{text-transform:capitalize; margin:calc(10px * var(--device)) 0; font-size: calc(54px * var(--device)); }
#index-banner .swiper-word .w-3{ width:80%; margin:0 auto; font-size: calc(28px * var(--device)); line-height:calc(30px * var(--device)) }
#index-banner .swiper-word .w-4{}

#Html-list-bags .item {border:1px #ddd solid;}
#Html-list-bags .item .item-img{padding-top:100%; height:0; position:relative;border-bottom:1px #ddd solid; overflow:hidden;} 
#Html-list-bags .item .item-img img{position:absolute; top:0%; left:0%; width:100%; height:100%; object-fit:cover;}

.icon-filter{display:block; margin:0 auto; width:calc(50px * var(--device));height:calc(50px * var(--device));}
