button.fancybox-button.fancybox-button--thumbs {
  display: none;
}
.fancybox-bg {
  opacity: 0.85 !important;
  transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
  display: block !important;
  background-color: #000;
}
.fancybox-button {
  background: transparent !important;
  color: grey;
}
.fancybox-button[disabled],
.fancybox-button[disabled]:hover {
  opacity: 0.3 !important;
}
.slider_container {
  margin-top: 64px;
  position: relative;

  overflow:hidden;
}
.slide_contents {
  padding: 48px 24px 0;
  text-align: center;
  pointer-events: none;
  z-index: 2;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
/*   height: 100%; */
}
.video_slider {
  position: relative;
  height: 100%;
}
.cnt_container {
  position: relative;
  height: calc(100% - 50px);
}
.cnt_item {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.ttl,
.pro_name h4 {
  font-size: 36px;
  line-height: 1.1;
  font-weight: 500;
  color: #fff;
  padding-bottom: 4px;
  margin: 0;
  display: block;
  width: 100%;
  height: auto;
  text-transform: capitalize;
}
.learn_more a {
  font-size: 16px;
  line-height: 1.5;
  color: #fff;
  font-weight: 600;
  word-wrap: break-word;
  margin: 24px auto 0 8px;
  display: inline-flex !important;
  align-items: center;
  margin-top: 16px;
  pointer-events: auto;
  position: relative;
  text-decoration: none;
  text-transform: capitalize;
}
.learn_more a:first-child {
  margin-left: 0;
}

.video_slider .swiper-pagination {
  position: absolute;
  bottom: 48px !important;  
  padding: 0 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  width: 100%;
}
.slide_btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0);
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  z-index: 9;
  cursor: pointer;
}

.btns {
  display: flex;
  width: 62%;
  z-index: 10;
  position: absolute;
  height: 20px;
  top: 50%;
  margin-left: auto;
  margin-right: auto;
  transform: translate(-50%, -50%);
  left: 50%;
}
.btn-prev {
  left: 10px;
}

.btn-next {
  right: 10px;
}

.btns .arrow-icon {
  display: flex;
  width: 10px;
  height: 20px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iN3B4IiBoZWlnaHQ9IjEycHgiIHZpZXdCb3g9IjAgMCA3IDEyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPHRpdGxlPuWbvuaghy1pY29uPC90aXRsZT4KICAgIDxkZWZzPgogICAgICAgIDxwYXRoIGQ9Ik04LjMyODMzMzE5LDEyLjUyOTIzOTUgQzguMDM2NjM0NTQsMTIuMjM2NjgxNiA4LjAzNjM4OTE0LDExLjc2Mjg4NTkgOC4zMjc1OTcsMTEuNDcwMDIzMSBMOC4zMjcyNDQzNSwxMS40Njk2Njk5IEwxMy43ODc5NDMyLDYgQzE0LjM3Mjc2ODksNi41ODU3ODY0NCAxNC4zNzI3Njg5LDcuNTM1NTMzOTEgMTMuNzg3OTQzMiw4LjEyMTMyMDM0IEw5LjkxNTYyNTE2LDEyIEwxMy43ODc5NDMyLDE1Ljg3ODY3OTcgQzE0LjM3Mjc2ODksMTYuNDY0NDY2MSAxNC4zNzI3Njg5LDE3LjQxNDIxMzYgMTMuNzg3OTQzMiwxOCBMOC4zMjcyNDQzNSwxMi41MzAzMzAxIEw4LjMyODMzMzE5LDEyLjUyOTIzOTUgWiIgaWQ9InBhdGgtMSI+PC9wYXRoPgogICAgPC9kZWZzPgogICAgPGcgaWQ9Iumhtemdoi0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0icGMvaGVyby8xIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjAuMDAwMDAwLCAtMzk0LjAwMDAwMCkiPgogICAgICAgICAgICA8ZyBpZD0iaW1nLSstZGl2LSstc3dpcGVyLXNjcm9sbGVyLWl0ZW0tKy1uYXYtbWFpbi3okpnniYgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0wLjExMDIzMywgMC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIGlkPSJpbWciIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMDAwMDAwLCAtMTg3LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgIDxnIGlkPSJDYXJvdXNlbC0tLei1sOmprOeBry/pgJrmoI8tLS1XaWRlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjExMDIzMywgNzUuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgIDxnIGlkPSLwn5qr5qih54mILXRlbXBsYXRlIj4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxnIGlkPSLlt6bkvqfnrq3lpLQtbGVmdC1hcnJvdyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC4wMDAwMDAsIDQ2NC4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0ibGlnaHQvYW5nbGUtbGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTIuMDAwMDAwLCAzNi4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPG1hc2sgaWQ9Im1hc2stMiIgZmlsbD0id2hpdGUiPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjcGF0aC0xIj48L3VzZT4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPC9tYXNrPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8dXNlIGlkPSJTaGFwZSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB4bGluazpocmVmPSIjcGF0aC0xIj48L3VzZT4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==);
}

.btn-next .arrow-icon {
  transform: rotate(180deg);
}

.video_item {
  overflow: hidden;
  max-width: 1200px;
  height:auto !important;
}
.video_item a {
    display: block;
  
    overflow: hidden;
    height:100%;
}

.video_item video source{
  width: 100%;
  transform: scale(1.2);
}
.video_item video {
  width:100%;
  height:100%;
}
.swiper-slide-active video source {
  transform: scale(1);
}

.ttl {
  opacity:0;
}
.swiper-slide-active .ttl {
  opacity:1;
}

.pro_name h4 {
  opacity: 0;
  transform: translateY(100%);
  transition: all 0.6s ease;
}
.swiper-slide-active .pro_name h4 {
  opacity: 1;
  transform: translateY(0);
}

.learn_more a {
  visibility: hidden;
  opacity: 0;
  transform: translateY(100%);
}
.swiper-slide-active .learn_more a {
  visibility: visible;
  transition: all 0.6s ease 0.3s;
  opacity: 1;
  transform: translateY(0);
}

.swiper-pagination-bullet {
  height: 100%;
  width: 16px;
  background-color: transparent;
  border-radius: 0;
  display: flex;
  align-items: center;
  cursor: pointer;
  opacity: 1;
}

.swiper-no-swiping .swiper-slide {
  pointer-events: none;
}

.swiper-slide-active .video_poster {
  display:none !important;
}

.video_poster {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(1.2);
    transition: transform .6s cubic-bezier(.25,.39,.25,1),opacity .6s ease-in-out;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display:block !important;
} 

/* .video_cnt {
  display:flex;
} */

.video_cnt {
    display: flex;
    width: 100%;
    height: 100%;
}

.video_slider .swiper-pagination-bullet:nth-child(n+2) {
    margin-left: 4px;
}

.video_slider .swiper-pagination-bullet {
    height: 100%;
    width: 16px;
    background-color: transparent;
    border-radius: 0;
    display: flex;
    align-items: center;
    cursor: pointer;
    opacity: 1;


    height: 2px;
    background-color: rgba(255,255,255,.3);
    border-radius: 60px;
    position: relative;
    overflow: hidden;
}

.swiper-pagination-bullet-active {
  background-color:#fff !important;
}

.sc-gjNHFA.gwWIgj {
  overflow:hidden;
}
.slide_btn:hover {
  background-color:rgba(0,0,0,.3);
}
@media only screen and (max-width: 749px) {

  .slider_container .video_slider .swiper-pagination {  
    bottom:25px !important;
  }
  .cnt_item .learn_more a {
    font-size: 14px;
  }

  .video_slider .video_item video {
/*     width: auto; */
    max-height: 480px;
  }
  .video_slider .video_item video {
    aspect-ratio: 4/5;
    object-fit: cover;
  }
  
  .video_slider .btns {
    width:100%;
  }
  .cnt_item .ttl, .cnt_item .pro_name h4 {
    font-size: 22px;
  }
  .learn_more a {
    margin-top:10px !important;
  }

  .btns .btn-prev {
    left: 0px;  
  }
  .btn-next {
    right: 0px;  
  }
  .mview {
    display:block !important;
  }
  .mhide {
    display:none !important;
  }
}

@media only screen and (min-width: 750px) and (max-width: 1199px) {
  .video_slider .btns {
    width:100%;
  }
  .ttl, .pro_name h4 {
    font-size:28px !important;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .video_slider .btns {
      width: 90% !important;
      max-width: 1200px;
  }

}

 .mview {
    display:none;
  }
  .mhide {
    display:block;
  }


.video_item a {
/*     position: relative;
    width: 100%; */
}
.video_cnt {
/*     display: block; */
/*     height: auto; */
/*     position: absolute; */
}
.video_item video {
/*     position: relative;
    display: block; */

      height: auto;
}
/* .video_item a:after {
    content: '';
    display: block;
    padding-bottom: calc(100% * (9/16));
} */