@charset "UTF-8";

/* ----------------------------------------------------------------------------
 * slide-banner
 * ------------------------------------------------------------------------- */

.uc-stop-start-button-hidden {
  display: block;
  width: 0 !important;
  height: 0 !important;
  visibility: hidden;
}

.uc-stop-start-button-hidden button {
  width: 0 !important;
  height: 0 !important;
  visibility: hidden;
}

.CMP-CM13-slide-banner .uc-carousel-stop-start-ui {
  display: block;
  position: relative;
}

.CMP-CM13-slide-banner .uc-carousel-stop-start-ui ul {
  position: absolute;
  top: 0px;
  right: 0px;
}

.CMP-CM13-slide-banner .uc-carousel-stop-start-ui ul li {
  list-style: none;
  width: 44px;
  height: 44px;
}

.CMP-CM13-slide-banner .uc-carousel-stop-start-ui ul button {
  cursor: pointer;
  width: 44px;
  height: 44px;
}

.CMP-CM13-slide-banner .uc-js-carousel-ui-stop::before, .CMP-CM13-slide-banner .uc-js-carousel-ui-start::before {
  content: '';
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  inset: 0;
  width: 44px;
  height: 44px;
}

.CMP-CM13-slide-banner .uc-js-carousel-ui-stop::before {
  background-image: url(/content/dam/sites/www_sofy_jp/images/common/common/button-stop.png), url(/content/dam/sites/www_sofy_jp/images/common/common/button-start.png);
}

.CMP-CM13-slide-banner .uc-js-carousel-ui-start::before {
  background-image: url(/content/dam/sites/www_sofy_jp/images/common/common/button-start.png), url(/content/dam/sites/www_sofy_jp/images/common/common/button-stop.png);
}

.CMP-CM13-slide-banner .uc-js-carousel-ui-stop span, .CMP-CM13-slide-banner .uc-js-carousel-ui-start span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.CMP-CM13-slide-banner .uc-js-carousel-ui-stop:hover::before, .CMP-CM13-slide-banner .uc-js-carousel-ui-start:hover::before {
  opacity: 0.8;
}

@media screen and (max-width: 768px), print {
  .CMP-CM13-slide-banner .uc-carousel-stop-start-ui ul button {
    width: 32px;
    height: 32px;
  }

  .CMP-CM13-slide-banner .uc-carousel-stop-start-ui ul li {
    width: 32px;
    height: 32px;
  }

  .CMP-CM13-slide-banner .uc-js-carousel-ui-stop::before, .CMP-CM13-slide-banner .uc-js-carousel-ui-start::before {
    content: '';
    width: 32px;
    height: 32px;
  }
}

.CMP-CM13-slide-banner-01 .uc-mod-carousel-01 .uc-carousel-stop-start-ui ul {
  top: 5px;
  right: 75px;
}

@media screen and (max-width: 768px), print {
  .CMP-CM13-slide-banner-01 .uc-mod-carousel-01 .uc-carousel-stop-start-ui ul {
    right: 8px;
  }
}

