/** VARIABLES
===================================*/
/** RESET AND LAYOUT
===================================*/
.home__slider{
  width:100%;
  overflow:hidden;
}
.bx-wrapper {
  position: relative;
  margin-bottom: 60px;
  padding: 0;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  border: none;
  width:100%;
  height: 948px;
}
.bx-wrapper > img {
  width: 100%;
  height:948px;
  display: block;
}
.bxslider {
  margin: 0;
  padding: 0;
}
ul.bxslider {
  list-style: none;
  padding:0;
}
ul.bxslider li{
  position:relative;
  width:100% !important;
  height: 990px;
}
ul.bxslider li span.txt > .up{
  display:block;
  font-size:25px;
  line-height:35px;
  font-weight:normal;
  animation-duration:0.2s;
  animation-name: subTxtSmall;
  font-family: "Noto Serif CJK KR", "Noto Serif KR", serif;
}
ul.bxslider li span.txt{
  position:absolute;
  display:block;
  top:32%;
  left:20%;
  text-align: center; 
  width:670px;
  z-index:100;
}
ul.bxslider li span.txt.Right{
  left:43% !important;
}
ul.bxslider li span.txt.top{
  top:36% !important;
}
ul.bxslider li span.txt > .small{
  display:block;
  padding-top:30px;
  font-size:21px;
  line-height:35px;
  font-weight:normal;
  animation-duration:0.7s;
  animation-name: subTxtSmall;
  font-family: "Noto Sans KR", "Noto Sans CJK KR", sans-serif;
}
ul.bxslider li span.txt > .TitleTxt{
  animation-duration:0.5s;
  animation-name: subTxt;
  display:block;
  font-size:78px;
  font-family: "Montserrat", "Noto Serif CJK KR", "Noto Serif KR", serif;
  letter-spacing: -0.05em;
  font-weight: 400;
  padding-top:1%;
}
ul.bxslider li span.txt > .Btn{
  display:block;
  width:230px; height:55px;
  border-radius:55px;
  text-align:center;
  line-height:55px;
  vertical-align:middle;
  margin: 30px auto 0 auto;
  border:1px solid #000000;
  font-weight:600;
}
ul.bxslider li span.deco1,
ul.bxslider li span.deco3{
  position:absolute;
  bottom:0; left:0;
  z-index:10;
}
ul.bxslider li span.deco2,
ul.bxslider li span.deco4{
  position:absolute;
  bottom:0; right:0;
  z-index:10;
}

ul.bxslider li span.model1{
  position:absolute;
  bottom:0; left:9%;
  z-index:20;
}
ul.bxslider li span.model2{
  position:absolute;
  bottom:0; right:9%;
  z-index:20;
}
ul.bxslider li span.model3{
  position:absolute;
  bottom:0; left:7%;
  z-index:20;
}
ul.bxslider li span.model4{
  position:absolute;
  bottom:2%; right:27%;
  z-index:20;
}



@keyframes subTxt {
  0% {
    left: 20%;
    transform: translateY(18px);
    opacity: 0;
  }

  100% {
    left: 20%;
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes subTxtSmall {
  0% {
    left: 20%;
    transform: translateY(32px);
    opacity: 0;
  }

  100% {
    left: 20%;
    transform: translateY(0);
    opacity: 1;
  }
}




ul.bxslider li.bg1{
  background-color:#e6ccbd;
}
ul.bxslider li.bg2{
  background-color:#fbf3d4;
}
ul.bxslider li.bg3{
  background-color:#f8e3d0;
}
ul.bxslider li.bg4{
  background-color:#f1cdbf;
}



.bx-viewport {
  /*fix other elements on the page moving (on Chrome)*/
  -webkit-transform: translatez(0);
}
/** THEME
===================================*/
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  position: absolute;
  bottom: -30px;
  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:600;
  color: #666;
  padding-top: 20px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
  text-indent: 0;
  display: block;
  width: 15px;
  height: 15px;
  margin: 0 5px;
  outline: 0;
  font-size:0.8rem;
  font-weight:normal;
  color:#727272;
}
.bx-wrapper .bx-pager.bx-default-pager a:after{
  display:block;
  content:'';
}
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
  color:#000;
  font-weight:600;
}
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
  display: inline-block;
  vertical-align: bottom;
}
.bx-wrapper .bx-pager-item {
  font-size: 0;
  line-height: 0;
  display:inline-block;
}
/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev {
  position:relative;
  background: url('https://suwonskin.co.kr/images/mainRollArrow1.png') no-repeat;
  display:block;
}
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
  background-position: 0 0;
}
.bx-wrapper .bx-next {
  position:relative;
  background: url('https://suwonskin.co.kr/images/mainRollArrow2.png') no-repeat;
  display:block;
}
.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
  background-position: 0 0;
}
.bx-wrapper .bx-controls-direction{
  position: absolute;
  top: 86%; left:70%;
  width:220px;
}
.bx-wrapper .bx-controls-direction a {
  display:inline-block;
  padding:0 15px;
  outline: 0;
  width: 77px;
  height:77px;
  text-indent: -9999px;
  z-index: 100;
}
.bx-wrapper .bx-controls-direction a.disabled {
  display: none;
}

/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
  position:absolute;
  display:none;
  top:85%;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
  display:none;
}
/* 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;
}


@media all and (max-width:767px){
  ul.bxslider li span.txt > .TitleTxt{
    letter-spacing: -0.05em;
    font-size: 70px;
  }
  ul.bxslider li span.txt{
    zoom: 0.6;
    width: 100%;
    top: 20% !important;
    left: 0;
    width:100%;
  }
  ul.bxslider li span.txt.Right{
    left:0 !important;
  }
  ul.bxslider li span.txt.top{
    top:20% !important;
  }
  .bx-wrapper .bx-controls-direction a{
    zoom: 0.75;
  }
  .bx-wrapper .bx-controls-direction{
    bottom: 9%;
    left: 0;
    width: 105%;
    text-align: center;
  }
  .bx-wrapper {
    min-width:100%;
    height: 730px !important;
  }
  ul.bxslider li{
    width:100% !important; height:730px !important;
  }

  ul.bxslider li span.txt1{
    top:36%;
    left:20px;
    font-size:18px;
    line-height:31px;
    animation-duration:0.5s;
    animation-name: subTxt;
  }

  @keyframes subTxt {
    0% {
      left: 20px;
      transform: translateY(30px);
      opacity: 0;
    }
  
    100% {
      left: 20px;
      transform: translateY(0);
      opacity: 1;
    }
  }


  ul.bxslider li span.txt1 .Mbr{
    clear:both;
    display:block;
  }
  ul.bxslider li span.txt1 br{
    display:none;
  }
  ul.bxslider li span.txt1 > .small{
    display:none;
  }
  .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager{
    top:90%;
    padding-left:30px;
    display:none;
  }
 
  
  ul.bxslider li span.deco1,
  ul.bxslider li span.deco3{
    zoom:0.5;
  }
  ul.bxslider li span.deco2,
  ul.bxslider li span.deco4{
    zoom:0.5;
  }

  ul.bxslider li span.model1{
    zoom: 0.4;
    left: 0;
    width: 100%;
    text-align: center;
  }
  ul.bxslider li span.model2{
    zoom: 0.4;
    right: 0;
    width: 100%;
    text-align: center;
  }
  ul.bxslider li span.model3{
    zoom: 0.4;
    left: 0;
    width: 100%;
    text-align: center;
  }
  ul.bxslider li span.model4{
    zoom: 0.4;
    left: 0;
    width: 100%;
    text-align: center;
  }
  .home__slider{
    height:730px;
  }

}


@media all and (max-width:1800px){
  ul.bxslider li span.model1{
    bottom:0; left:0;
    z-index:20;
  }
  ul.bxslider li span.model2{
    bottom:0; right:-29%;
    z-index:20;
  }
  ul.bxslider li span.model3{
    bottom:0; left:0;
    z-index:20;
  }
  ul.bxslider li span.model4{
    bottom:2%; right:7%;
    z-index:20;
  }

}