ul.bxslider {
  margin: 0 108px;
  padding: 0;
  height: auto;
  z-index: 50;
  overflow: hidden;
}

ul.bxslider > li {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: visible;
  width: 800px !important;
  height: auto !important;
  border-top: 4px solid #000;
  border-bottom: 4px solid #000;
  border-left: 2px solid #000;
  border-right: 2px solid #000;
}
ul.bxslider > li > a{
  margin: 0;
  padding: 0;
}
ul.bxslider > li > img{
  margin: 0;
  padding: 0;
}

.contents .keyimg {
  position: relative;
  margin: 0;
  padding: 0;
  width: 100%;
  overflow: hidden;
  height: 258px;
  background-color : #fff;
  line-height: 0;
}
.contents .keyimg .bx-viewport {
  margin: 0;
  padding: 0;
  background: transparent !important;
}

.contents .txtbox {
  margin-top: 0;
}


.bx-wrapper .bx-prev {
  top: 50%;
  background: url(../img/bx-prev.png) no-repeat;
}
.bx-wrapper .bx-next {
  top: 50%;
  right: 0;
  background: url(../img/bx-next.png) no-repeat;
}
.bx-wrapper .bx-prev:hover {
  background: url(../img/bx-prev_active.png) no-repeat;
}
.bx-wrapper .bx-next:hover {
  background: url(../img/bx-next_active.png) no-repeat;
}

.bx-wrapper .bx-controls-direction a {
  position: absolute;
  outline: 0;
  margin-top: -19px;
  width: 38px;
  height: 38px;
  text-indent: -9999px;
  z-index: 9999;
}

@media screen and (max-width: 1044px) {
  ul.bxslider {
    margin: 0 80px;
  }
  ul.bxslider li {
    width: 600px !important;
    height: auto !important;
    overflow: hidden;
  }
  ul.bxslider > li > a > img{
    max-width: 600px;
    width: 100% !important;
    height: auto !important;
  }
  .contents .keyimg {
    height: 197px;
  }
}
@media screen and (max-width: 787px) {
  ul.bxslider {
    margin: 0;
  }
  ul.bxslider li {
    border-left:4px solid #000;
    border-right:4px solid #000;
    width: 460px !important;
  }
  ul.bxslider > li > a > img{
    max-width: 460px;
    width: 100% !important;
  }
  .contents .keyimg {
    width: 100%;
    height: 152px;
  }
}
@media screen and (max-width: 484px) {
  .contents .keyimg {
    max-height: 152px;
    height: auto;
  }
  ul.bxslider li {
    border: none;
  }
  ul.bxslider > li > a > img{
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    box-sizing: border-box;
  }
}

