/** VARIABLES
===================================*/
/** RESET AND LAYOUT
===================================*/
.bx-wrapper {
  position: relative;
  margin-bottom: 30px;
  padding: 0;
  *zoom: 1;
  /* -ms-touch-action: pan-y;
  touch-action: pan-y; */
  /* -ms-touch-action: pinch-zoom !important;
  touch-action: pinch-zoom !important; */
}
.bx-wrapper img {
  max-width: 100%;
  display: block;
  cursor: pointer;
}
.bxslider {
  margin: 0;
  padding: 0;
  /*fix flickering when used background-image instead of <img> (on Chrome)*/
  perspective: 1000;
  -webkit-perspective: 1000;
}
ul.bxslider {
  list-style: none;
}
.bx-viewport {
  /* fix other elements on the page moving (in Chrome) */
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}
/** THEME
===================================*/
.bx-wrapper {

  /* -moz-box-shadow: 0 0 5px #ccc; */
  /* -webkit-box-shadow: 0 0 5px #ccc; */
  /* box-shadow: 0 0 5px #ccc; */
  /* border: 5px solid #fff; */
  /* background: rgb(0, 0, 0); */
}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  position: absolute;
  bottom: -20px;
  width: 100%;
}
/* LOADER */
.bx-wrapper .bx-loading {
  min-height: 50px;
  background: url('images/bx_loader.gif') center center no-repeat #ffffff;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2000;
}
/* PAGER */
.bx-wrapper .bx-pager {
  text-align: center;
  font-size: .85em;
  font-family: Arial;
  font-weight: bold;
  color: rgb(201, 201, 201);
  padding-top: 10px;
  
}
.bx-wrapper .bx-pager.bx-default-pager a {
  background: rgb(176, 176, 176);
  text-indent: -9999px;
  display: block;
  width: 8px;
  height: 8px;
  margin: 0 5px;
  outline: 0;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  transition: all 0.4s ease;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover{
  background: rgb(63, 75, 150);
}
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
  width: 20px;
  background: rgb(63, 75, 150);
}
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
  display: inline-block;
  vertical-align: bottom;
  *zoom: 1;
  *display: inline;
}
.bx-wrapper .bx-pager-item {
  font-size: 0;
  line-height: 0;
}
/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev {
  left: 10px;
  background: url('images/controls.png') no-repeat 0 -32px;
}
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
  background-position: 0 0;
}
.bx-wrapper .bx-next {
  right: 10px;
  background: url('images/controls.png') no-repeat -43px -32px;
}
.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
  background-position: -43px 0;
}
.bx-wrapper .bx-controls-direction a {
  position: absolute;
  top: 50%;
  margin-top: -16px;
  outline: 0;
  width: 32px;
  height: 32px;
  text-indent: -9999px;
  z-index: 9999;
}
.bx-wrapper .bx-controls-direction a.disabled {
  display: none;
}
/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto {
  text-align: center;
}
.bx-wrapper .bx-controls-auto .bx-start {
  display: block;
  text-indent: -9999px;
  width: 10px;
  height: 11px;
  outline: 0;
  background: url('images/controls.png') -86px -11px no-repeat;
  margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active,
.bx-wrapper .bx-controls-auto .bx-start:focus {
  background-position: -86px 0;
}
.bx-wrapper .bx-controls-auto .bx-stop {
  display: block;
  text-indent: -9999px;
  width: 9px;
  height: 11px;
  outline: 0;
  background: url('images/controls.png') -86px -44px no-repeat;
  margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active,
.bx-wrapper .bx-controls-auto .bx-stop:focus {
  background-position: -86px -33px;
}
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
  text-align: left;
  width: 80%;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
  right: 0;
  width: 35px;
}
/* IMAGE CAPTIONS */
.bx-wrapper .bx-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #666;
  background: rgba(80, 80, 80, 0.75);
  width: 100%;
}
.bx-wrapper .bx-caption span {
  color: #fff;
  font-family: Arial;
  display: block;
  font-size: .85em;
  padding: 10px;
}
		
/** MY SETTING	
===================================*/
/** FOR Vertical Middle */	

.bx-wrapper {
  /* -moz-box-shadow: 0 0 5px #ccc; */
  /* -webkit-box-shadow: 0 0 5px #ccc; */
  /* box-shadow: 0 0 5px #ccc; */
  /* border: 1px solid var(--border-color);*/
  /* border-radius: 5px;  */
  /* border-radius: 7px; */
  margin: 0;
  padding: 5px;
}
.bx-wrapper .bx-controls-direction a {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  /* background-color: white; */
  top: 50%;
  margin-top: -15px;
  outline: 0;
  width: 30px;
  height: 30px;
  text-indent: -9999px;
  z-index: 9997;
}

.bx-wrapper .bx-prev {
  left: 10px;
  background: none;
}
.bx-wrapper .bx-next {
  right: 10px;
  background: none;
}

.nText{
  transition: opacity 0.3s ease, transform 0.3s ease;
  -webkit-transition: opacity 0.3s ease, transform 0.3s ease;
  opacity: 0%;
  transform: scale(0.7);
  -webkit-transform: scale(0.7);
}
.bx-wrapper:hover .nText{
  opacity: 70%;
}
.bx-controls-direction a:hover .nText{
  opacity: 100%;
  transform: scale(0.8);
  -webkit-transform: scale(0.8);
}

.bx-wrapper .bx-pager{
  position: absolute;
  bottom: 10px;
  width: 100%;
}

.slider-inner{
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  background: rgb(0, 0, 0);
}

.bx-viewport{
  border-radius: 7px;
  /* background: rgb(0, 0, 0); */
}

.bx-wrapper .bx-caption {
  background: rgba(103, 105, 121, 0.8);
  top: 0px;
  bottom: auto;
  opacity: 0;
  transition: opacity 0.4s ease;
  -webkit-transition: opacity 0.4s ease;
  will-change: opacity;
  /* transform: translateZ(0); */
  z-index: 2;
}

.bx-wrapper .bx-caption span {
  color: #fff;
  font-family: 'Pretendard-Light';
  padding: 8px 10px;
}

.bx-wrapper:hover .bx-caption {
  transition: opacity 0.4s 0.2s ease;
  -webkit-transition: opacity 0.4s 0.2s ease;
  opacity: 1;
}

.bx-wrapper video{
  max-width: 100%;
  max-height: 100%;
  z-index: 1;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  /* will-change: width, height, position; */
}
.bx-wrapper img{
  /* will-change: width, height; */
}


/** For Fixed Window **/
.bx-wrapper-fixed{
  position: fixed;
  margin: 0;
  padding: 0;
  /* display: flex;
  align-items: center;
  justify-content: center; */
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: #666;
  z-index: 9998;
}

.slider-inner-fixed{
  height: 100vh !important;
  height: calc(var(--vh, 1vh) * 100) !important;
}

.bx-viewport-fixed{
  /* height: 100% !important; */
  height: 100vh !important;
  height: calc(var(--vh, 1vh) * 100) !important;
  border-radius: 0;
}

.bx-prev-fixed {
  left: 25px !important; 
}
.bx-next-fixed {
  right: 25px !important;
}

.bx-caption-fixed{
  opacity: 100% !important;
}

.img-fixed{
  cursor: default !important;
  max-height:100% !important;
  max-width: 100% !important;
  /* height: 80vh !important; */
  /* width: 100% !important; */
  /* object-fit: cover; */
}
.bx-pager-fixed{
  bottom: 20px !important;
}
.bx-caption-span-fixed{
  padding: 10px 20px !important;
  font-size: 1em !important;
}
.x-btn{
  display: none;
}

.x-btn-fixed{
  display: block;
  position:fixed;
  width: 18px;
  padding: 20px;
  bottom: 1%;
  right: 1%;
  opacity: 60%;
  cursor: pointer;
  z-index: 9999;
}
.x-btn-fixed:hover{
  opacity: 100%;
}
/** For Fixed Window END **/


@media screen and (max-width: 480px){
  .bx-wrapper{
    padding: 0;
  }

  .bx-wrapper .bx-caption span {
    padding: 5px 10px;
  }

  .bx-caption-span-fixed{
    padding: 10px 15px !important;
    font-size: 0.9em !important;
  }
}