/*banner*/

.indexbanner { width: 100%; position: relative; height: auto !important;}

.indexbanner .arrow-left { width: 60px; height: 60px; position: absolute; left: 50px; top: 50%; z-index: 9; margin-top: -30px; 
  /* background-image: url(../images/banner_prev01.png);  */
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; }

.indexbanner:hover .arrow-left { background-image: url(../images/banner_prev03.png); }

.indexbanner .arrow-right { width: 60px; height: 60px; position: absolute; right: 50px; top: 50%; z-index: 9; margin-top: -30px; 
  /* background-image: url(../images/banner_next01.png);  */
  background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; }

.indexbanner:hover .arrow-right { background-image: url(../images/banner_next03.png); }

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

.indexbanner .swiper-container .swiper-wrapper { height: auto !important; }

.indexbanner .swiper-container .swiper-slide { height: auto !important; position: relative; background-size: cover; background-repeat: no-repeat; background-position: center center; }

.indexbanner .swiper-container .swiper-slide > a { width: 100%; display: block;overflow: hidden;height: 850px;position: relative}
.indexbanner .swiper-container .swiper-slide > a img{
  width: 1920px;
  height: 850px;
  position: absolute; left: 50%;margin-left: -960px;
}

.indexbanner .Bcon { position: absolute; left: 15%; top: 50%; margin-top: -100px; }

.indexbanner .Bcon .BannerH { color: #fff; font-size: 60px; line-height: 64px; margin-bottom: 20px; }

.indexbanner .Bcon .BannerT { color: #fff; font-size: 28px; line-height: 40px; margin-bottom: 50px; }

.indexbanner .Bcon .shopbtn { color: #e30000; font-size: 18px; padding: 4px 30px; line-height: 20px; margin-right: 15px; border-radius: 30px; display: inline-block; border: 1px solid #e30000; }



.indexbanner .pagination { margin: 0; width: 100%; display: block; position: absolute; z-index: 20; bottom: 30px; border-radius: 0; text-align: center; }

.indexbanner .pagination .swiper-pagination-switch { width: 60px; height: 4px; margin: 0 5px; background: #fff; overflow: hidden; border-radius: 5px; display: inline-block; }

.indexbanner .pagination .swiper-active-switch { background: #e30000; }



.maintop { margin: 80px 0; position: relative; }

.maintop a { height: 100%; display: block; }

.maintop a:hover { box-shadow: 0 0 20px #ccc; }

.maintop .mainTL { width: 50%; height: 100%; position: absolute; top: 0; left: 0; padding-right: 15px; }

.maintop .mainTL img { height: 100%; }

.maintop .mainTR { width: 100%; padding-left: 50%; }

.maintop .mainTR .mainTRcon { width: 100%; padding-left: 15px; }

.maintop .mainTR .mainTRcon .conTimg { margin-bottom: 30px; }



.mainlist { margin: 0 -15px; margin-bottom: 80px; }

.mainlist li { width: 25%; float: left; padding: 0 15px; }

.mainlist li a { display: block; }

.mainlist li .listTop { width: 100%; position: relative; }

.mainlist li .listTop .listimg { width: 100%; overflow: hidden; }

.mainlist li .listTop .listimg img { transition: 1s; }

.mainlist li .listTop .listcon { width: 100%; height: auto; text-align: center; padding: 10px 20px; position: absolute; left: 0; bottom: 0; background: rgba(0, 0, 0, 0.4); filter: alpha(opacity=40); }

.mainlist li .listTop .listcon p { color: #fff; height: 48px; font-size: 16px; line-height: 24px; position: relative; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; text-overflow: ellipsis; -webkit-box-orient: vertical; }

.mainlist li .listB { width: 100%; padding: 20px; background: #eee; text-align: center; }

.mainlist li .listB h2 { color: #000; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 20px; line-height: 24px; font-weight: bold; margin-bottom: 10px; }

.mainlist li .listB p { color: #e30000; font-size: 18px; line-height: 24px; }

.mainlist li:hover { transition: 1s ease; transform: translate(0px, -8px); -ms-transform: translate(0px, -8px); -webkit-transform: translate(0px, -8px); }

.mainlist li:hover .listTop .listimg img { -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); -o-transform: scale(1.15); transform: scale(1.15); }



.indexshop { width: 100%; padding: 80px 5%; background: #eee; }

.indexshop li { width: 25%; float: left; padding: 0 15px; }

.indexshop li .indexshopbox { width: 100%; padding: 40px; background: #fff; text-align: center; }

.indexshop li .indexshopbox .shopboximg { width: 100%; overflow: hidden; }

.indexshop li .indexshopbox .shopboximg img { width: auto; transition: 1s; max-width: 100%; }

.indexshop li .indexshopbox .shopboxcon { margin-top: 20px; }

.indexshop li .indexshopbox .shopboxcon h2 { color: #000; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 20px; font-weight: bold; line-height: 24px; margin-bottom: 10px; }

.indexshop li .indexshopbox .shopboxcon p { color: #333; font-size: 18px; line-height: 20px; margin-bottom: 12px; }

.indexshop li .indexshopbox .shopboxcon a { color: #333; font-size: 12px; padding: 4px 24px; border-radius: 30px; display: inline-block; border: 1px solid #b2b2b2; }

.indexshop li:hover .indexshopbox { box-shadow: 0 0 10px #999; }

.indexshop li:hover .indexshopbox .shopboximg img { -webkit-transform: scale(1.15); -moz-transform: scale(1.15); -ms-transform: scale(1.15); -o-transform: scale(1.15); transform: scale(1.15); }

.indexshop li:hover .indexshopbox .shopboxcon a { color: #e30000; border: 1px solid #e30000; }



.shoplist { width: 100%; padding: 80px 5% 50px; }

.shoplist li { width: 50%; float: left; padding: 0 15px; margin-bottom: 30px; }

.shoplist li a { display: block; position: relative; }

.shoplist li .shoplistbox { width: 100%; height: 100%; display: flex; align-items: center; display: -webkit-flex; -webkit-align-items: center; position: absolute; top: 0; left: 0; z-index: 2; }

.shoplist li .shoplistbox .shoplistmask { width: 100%; height: 100%; background: #000; opacity: 0.4; filter: alpha(opacity=40); position: absolute; top: 0; left: 0; z-index: 3; }

.shoplist li .shoplistbox .shoplistcon { width: 100%; padding: 0 60px; text-align: center; position: relative; z-index: 4; }

.shoplist li .shoplistbox .shoplistcon h3 { color: #fffefe; font-size: 28px; line-height: 30px; margin-bottom: 25px; text-transform: uppercase; }

.shoplist li .shoplistbox .shoplistcon p { color: #fff; height: 48px; font-size: 18px; line-height: 24px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; text-overflow: ellipsis; -webkit-box-orient: vertical; }

.shoplist li:hover { transition: 1s ease; transform: translate(0px, -8px); -ms-transform: translate(0px, -8px); -webkit-transform: translate(0px, -8px); }

.shoplist li:hover .shoplistbox .shoplistcon h3 { color: #e30000; }



@media (max-width: 1199px) { .indexbanner .Bcon .BannerH { font-size: 45px; margin-bottom: 10px; }

  .indexshop { padding: 80px 5% 40px; }

  .indexshop li { width: 50%; margin-bottom: 40px; } }

@media (max-width: 991px) { .indexbanner .arrow-left { left: 30px; width: 44px; height: 44px; margin-top: -22px; }

  .indexbanner .arrow-right { right: 30px; width: 44px; height: 44px; margin-top: -22px; }

  .indexbanner .Bcon { margin-top: -80px; }

  .indexbanner .Bcon .BannerH { font-size: 30px; line-height: 34px; }

  .indexbanner .Bcon .BannerT { font-size: 22px; line-height: 30px; }

  .mainlist li { width: 50%; margin-bottom: 30px; }

  .shoplist li .shoplistbox .shoplistcon { padding: 0 30px; }

  .shoplist li .shoplistbox .shoplistcon h3 { font-size: 20px; margin-bottom: 15px; line-height: 24px; } }

@media (max-width: 767px) { .indexbanner .pagination { bottom: 10px; }

  .indexbanner .pagination .swiper-pagination-switch { width: 30px; height: 2px; }

  .indexbanner .Bcon { left: 10%; margin-top: -50px; }

  .indexbanner .Bcon .BannerH { font-size: 20px; line-height: 24px; }

  .indexbanner .Bcon .BannerT { width: 200px; font-size: 14px; line-height: 16px; margin-bottom: 30px; }

  .indexbanner .Bcon .shopbtn { padding: 0 12px; font-size: 12px; }

  .maintop { margin: 40px 0; }

  .maintop .mainTL { width: 100%; padding-right: 0; position: static; margin-bottom: 15px; }

  .maintop .mainTR { padding-left: 0; }

  .maintop .mainTR .mainTRcon { padding-left: 0; }

  .maintop .mainTR .mainTRcon .conTimg { margin-bottom: 15px; }

  .mainlist { margin: 0; margin-bottom: 40px; }

  .mainlist li { width: 100%; float: none; padding: 0; }

  .mainlist li .listTop .listcon p { height: 40px; font-size: 14px; line-height: 20px; }

  .mainlist li .listB h2 { font-size: 18px; }

  .mainlist li .listB p { font-size: 16px; }

  .indexshop { padding: 40px 15px 20px; }

  .indexshop li { width: 100%; float: none; padding: 0; margin-bottom: 30px; }

  .indexshop li .indexshopbox { padding: 20px; }

  .indexshop li .indexshopbox .shopboxcon h2 { font-size: 18px; }

  .indexshop li .indexshopbox .shopboxcon p { font-size: 16px; }

  .shoplist { padding: 40px 15px 20px; }

  .shoplist li { width: 100%; float: none; padding: 0; }

  .shoplist li .shoplistbox .shoplistcon h3 { font-size: 18px; }

  .shoplist li .shoplistbox .shoplistcon p { height: 40px; font-size: 16px; line-height: 20px; } }



/*# sourceMappingURL=index.css.map */
@media (min-width: 768px) {
  .pcbanner{
    display: block
  }
  .mobilebanner{
    display: none
  }
}


/* 手机端 */
@media (max-width: 768px) {
  .pcbanner{
    display: none
  }
  .mobilebanner{
    display: block
  }
  .indexbanner .swiper-container .swiper-slide > a {
    width: 100%;
    display: block;
    overflow: hidden;
    height: auto;
    position: relative;
  }
  .indexbanner .swiper-container .swiper-slide > a img {
    width: 100%;
    height: auto;
    position: relative;
    left: 0;
    margin-left: 0;
  }
}