﻿/*banner轮播图*/

.banner {
 margin: 0 auto;
 position: relative;
 overflow: hidden;
}

.banner .arrow_btn {
 position: absolute;
 top: 50%;
 z-index: 2;
 width: 40px;
 height: 75px;
 margin-top: -50px;
 border-radius: 3px;
 opacity: 0.5;
 text-indent: -9999px;
 background-repeat: no-repeat;
 transition: opacity .2s linear 0s;
 cursor: pointer;
}

.banner img {
 width: 100%;
 transform: scale(1.1)
}

.banner .arrow-left {
 left: 5px;
 background: url(/Content/Areas/Hospitals/images/Main/banner_btn.png) no-repeat left bottom;
}

.banner .arrow-right {
 right: 5px;
 background: url(/Content/Areas/Hospitals/images/Main/banner_btn.png) no-repeat right bottom;
}

.banner div.swiper-container-horizontal>div.swiper-pagination-bullets {
 display: flex;
 align-items: center;
 justify-content: center;
 bottom: 30px;
 position: absolute;
 z-index: 9999;
}

.banner span.swiper-pagination-bullet {
 width: 38px;
 height: 32px;
 background: url(/Content/Areas/Common/images/common/arrow.png)no-repeat;
 margin: 0 8px !important;
 opacity: 1;
}

.banner span.swiper-pagination-bullet-active {
 background: url(/Content/Areas/Common/images/common/arrowHover.png) no-repeat;
}

@keyframes upin {
 0% {
 transform: scale(1.1)
 }
 100% {
 transform: scale(1)
 }
}

.banner .swiper-slide-on img {
 animation: upin 6s ease
}
@media only screen and (min-width: 1400px) and (max-width: 1700px) {
  .banner  img {
 transform: scale(1.2)
}
  @keyframes upin {
 0% {
 transform: scale(1.2)
 }
 100% {
 transform: scale(1.18)
 }
}
}
@media only screen and (max-width: 768px) {
 .banner div.swiper-container-horizontal>div.swiper-pagination-bullets {
 display: none;
 }
} 