@charset "UTF-8";
.top-page-carousel-wrapper {
  position: relative;
}

/*戻る/進むボタンのスタイル*/
.top-page-carousel-button {
  all: initial;
  cursor: pointer;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
          transform: translate(0, -50%);
  color: #fff;
  border: none;
  -webkit-filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
          filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
  z-index: 4;
}

.top-page-carousel-button:hover, .top-page-carousel-button:focus, .top-page-carousel-button:active {
  background: initial;
}

.top-page-carousel-button:active {
  top: 51%;
  -webkit-filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.25));
          filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.25));
}

/*戻る/進むボタンの画像のスタイル*/
.top-page-carousel-button img {
  width: 45px;
}

/*ボタン押下時のデザインを初期化*/
.top-page-carousel-button::after {
  all: initial;
}

/*前に戻るボタンのスタイル*/
.top-page-carousel-button-prev {
  left: -60px;
}

/*先に進むボタンのスタイル*/
.top-page-carousel-button-next {
  right: -60px;
}

/*全画像表示部分のカバーのスタイル*/
.carousel-button-wrapper {
  height: 100%;
  margin: 0 3px;
  padding: initial;
  border: 2px solid whitesmoke;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  max-width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/*全画像表示部分のカバーのスタイル*/
.carousel-button-wrapper::after {
  all: initial;
}

/*全画像表示部分のカバーホバー時のスタイル*/
.carousel-button-wrapper:hover {
  color: whitesmoke;
  border-color: whitesmoke;
}

/*全画像表示部分のカバーフォーカス時のスタイル*/
.carousel-button-wrapper:focus {
  color: #fed005;
  border-color: #fed005;
  border: 2px solid #fed005;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/*全画像表示部分のカバーアクティブ時のスタイル*/
.carousel-button-wrapper:active {
  color: #fed005;
  border-color: #fed005;
  border: 2px solid #fed005;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/*画像自体のスタイル*/
.carousel-button {
  width: 100%;
}

@media (max-width: 991px) {
  /*戻る/進むボタンの画像のスタイル*/
  .top-page-carousel-button img {
    width: 32px;
  }
  /*前に戻るボタンのスタイル*/
  .top-page-carousel-button-prev {
    left: -15px;
  }
  /*先に進むボタンのスタイル*/
  .top-page-carousel-button-next {
    right: -15px;
  }
}
@media (max-width: 767px) {
  /*全画像表示部分のカバーのスタイル*/
  .carousel-button-wrapper {
    margin: 0 1px;
  }
}
/*# sourceMappingURL=/codebuild/output/src2623623628/src/embotters-app/EmbottersApp/EmbottersApp/wwwroot/Css/online-course-ant-modal.css.map */