@font-face {
  font-family: 'icomoon';
  src: url("/top/fonts/icomoon.eot?49kkac");
  src: url("/top/fonts/icomoon.eot?49kkac#iefix") format("embedded-opentype"), url("/top/fonts/icomoon.ttf?49kkac") format("truetype"), url("/top/fonts/icomoon.woff?49kkac") format("woff"), url("/top/fonts/icomoon.svg?49kkac#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block
}

[class^="icon-"], [class*=" icon-"] {
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

.icon-next:before {
  content: "\e900"
}

.icon-prev:before {
  content: "\e901"
}

.mvp-recomend-section {
  background-color: #d4dde7
}

.mvp-recomend-section-title {
  font-size: 130%;
  font-weight: bold;
  margin-bottom: 15px;
  margin-bottom: .9375rem
}

.mvp-recomend-section-inner {
  padding: 20px 30px 30px;
  padding: 1.25rem 1.875rem 1.875rem
}

.swiper-area {
  position: relative
}

.swiper-container {
  width: 100%;
  margin: 0px auto;
  margin: 0rem auto;
  height: 100%
}

.swiper-area .swiper-slide {
  height: calc((100% - 20px) / 2);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 275px;
  margin-right: 20px;
  margin-right: 1.25rem
}

.swiper-slide a {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%
}

.swiper-slide a img {
  width: 100%;
  flex-shrink: 0;
  border: 1px solid #fff;
  box-sizing: border-box !important;
}

.swiper-slide a span {
  display: block;
  flex-grow: 1;
  font-size: 87.5%;
  color: #fff;
  background-color: #414650;
  padding: 5px 8px;
  padding: .3125rem .5rem;
}

.swiper-slide a span.origin {
  display: none
}

.swiper-slide a span.change {
  visibility: hidden
}

.swiper-button {
  z-index: 1;
  color: #454545;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  width: 46px;
  height: 46px;
  font-size: 34px;
  font-weight: bold
}

.swiper-button:focus {
  outline: none
}

.swiper-button:after {
  display: none
}

@media screen and (min-width: 1041px) {
  .swiper-button.swiper-top-next {
    right: -60px
  }
  .swiper-button.swiper-top-prev {
    left: -60px
  }
}

@media screen and (max-width: 1040px) {
  .swiper-button-next {
    right: -10px
  }
  .swiper-button-prev {
    left: -10px
  }
}

@media screen and (min-width: 1041px) {
  .swiper-button-next {
    right: -30px
  }
  .swiper-button-prev {
    left: -30px
  }
}

.swiper-button-disabled {
  transition: opacify 0.3s ease;
  opacity: 0 !important
}