@charset "utf-8";

/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*    bxslider の上書き用                           */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

.bx-wrapper{
  margin: 0 auto;
  border: none;
  background: none;
  box-shadow: none;

    .bx-viewport{
      border: none;
      background: none;
      box-shadow: none;
      left: auto;
    }
    
    /* Pagerのスタイル */
    .bx-pager.bx-default-pager{
      font-size: 1.5rem;
      a {
        margin: 0 0.5em;
        position: relative;
        z-index: 100;
        //width:  2em;
        //height: 1px;
        border-radius: 1em;
        background: rgba(0,0,0,0.375);

        &:hover,
        &.active,
        &:focus {
          background: rgba(0,0,0,1);
        }
      }
    }




    /* DIRECTION CONTROLS (NEXT / PREV)のスタイル */
    .bx-prev {
      left: -1em;
      background: none;
      @include media-query(under-bp-l) {
        left: 0em;
      }
    }
    .bx-next {
      right: -1em;
      background: none;
      @include media-query(under-bp-l) {
        right: 0em;
      }
    }
    .bx-next,
    .bx-prev {
      opacity: 0.5;
      &:hover,
      &:focus{
        opacity: 1;
      }
    }
    .bx-controls-direction a {
      position: absolute;
      top: 50%;
      margin-top: -0.5em;
      outline: 0;
      width:  auto;
      height: auto;
      line-height: 1;
      text-indent: 0;
      z-index: 100;
    }
    .bx-controls-direction a.disabled {
      display: none;
    }


            /* + + + + + レスポンシブ + + + + +  */
            @include media-query(over-bp-m) {
                .bx-controls-direction a{
                  font-size: 3rem;
                }
            }
            @include media-query(under-bp-m) {
                .bx-controls-direction a{
                  font-size: 2rem;
                }
            }

}