/* 追加・上書き用CSS */

/* for FLEXSLIDE */
#topslide {
  position: relative;
  padding: 20px 56px;
  max-width: 1384px;
  margin: 0 auto;
}
.slides::after {
  content: "";
  display: table;
  height: 0;
  clear: both;
}
.flex-direction-nav a {
  position: absolute;
  width: 80px;
  height: 80px;
  margin-top: -40px;
  outline: 0;
  opacity: 1;
  text-indent: -9990em;
  transition: 0.3s;
}
.flex-direction-nav a:hover {
  opacity: 0.7;
}
.flex-direction-nav a::before {
  display: none;
}
.flex-direction-nav .flex-nav-prev a {
  left: 20px;
  background: url(/images/prev.png) center no-repeat;
  background-size: 100%;
}
.flex-direction-nav .flex-nav-next a {
  right: 20px;

  background: url(/images/next.png) center no-repeat;
  background-size: 100%;
  text-align: left;
}
.flex-control-nav {
  left: 0;
  bottom: -20px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #topslide {
    padding: 20px 20px 30px;
  }
  .flex-direction-nav a {
    width: 36px;
    height: 36px;
    margin-top: -30px;
  }
  .flex-direction-nav .flex-nav-prev a {
    left: 0;
  }
  .flex-direction-nav .flex-nav-next a {
    right: 0;
  }
}
@media screen and (max-width: 480px) {
  #topslide {
    padding: 15px 10px 30px;
  }
  .flex-control-nav {
    bottom: 0;
  }
}