.caption, .slick-slide::before, .slick-slide { -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.slick-slide::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.main-slider { position: relative; width: 100%; min-height: 8vw; opacity: 0; visibility: hidden; transition: all 1.2s ease; }

@media all and (max-width: 44.9375em) { .main-slider { display: none; } }

@media (min-width: 64.0625em) { .main-slider { display: block; } }

.main-slider .slick-slide { height: 48.25vw; }

.main-slider .bg-img { position: relative; background-position: center center; background-size: cover; }

.main-slider .bg-img span { display: block; position: absolute; width: 20%; height: 20%; top: 50%; left: 50%; transform: translate(-50%, -50%); background-image: url(../images/index/icon-play.png); background-repeat: no-repeat; background-size: contain; background-position: center center; }

.main-slider.slick-initialized { opacity: 1; visibility: visible; }

.slick-slide { position: relative; height: 38vw; }

.slick-slide::before { background-color: #000; opacity: 0.3; z-index: 1; }

.slick-slide video { display: block; position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; transform: translate(-50%, -50%); }

.slick-slide iframe { position: relative; pointer-events: none; }

.slick-slide figure { position: relative; height: 100%; }

.slick-slide .slide-image { opacity: 0; height: 100%; background-size: cover; background-position: center; transition: all 0.8s ease; }

.slick-slide .slide-image.show { opacity: 1; }

.slick-slide .image-entity { width: 100%; opacity: 0; visibility: hidden; }

.slick-slide .loading { position: absolute; top: 44%; left: 0; width: 100%; }

.slick-slide .slide-media { -webkit-animation: slideOut 0.4s cubic-bezier(0.4, 0.29, 0.01, 1); animation: slideOut 0.4s cubic-bezier(0.4, 0.29, 0.01, 1); }

.slick-slide.slick-active { z-index: 1; }

.slick-slide.slick-active .slide-media { -webkit-animation: slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1); animation: slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1); }

.slick-slide.slick-active .caption { opacity: 1; transform: translateY(0); transition: all 0.7s cubic-bezier(0.32, 0.34, 0, 1.62) 0.6s; }

.caption { position: absolute; top: 44%; left: 5%; text-align: center; padding: 20px; border: 3px solid; color: #fff; margin: 0; font-size: 40px; font-weight: bold; letter-spacing: 0.02em; opacity: 0; z-index: 1; transition: all 0.3s ease; transform: translateY(100px); }

.slick-dots { text-align: center; padding-top: 15px; }

.slick-dots li { display: inline-block; vertical-align: top; margin: 0 8px; }

.slick-dots li button { width: 16px; height: 16px; border: none; cursor: pointer; border-radius: 50%; border: 2px solid #D6D6D6; box-shadow: 0 0 0 0 transparent; vertical-align: middle; color: transparent; background-color: #D6D6D6; transition: all 0.3s ease; opacity: 0.4; }

.slick-dots li button:focus { outline: none; }

.slick-dots li button:hover { opacity: 1; }

.slick-dots li.slick-active button { border-color: #e94820; box-shadow: 0 0 0 2px transparent; background-color: #e94820; color: transparent; opacity: 1; }

@-webkit-keyframes slideIn { from { filter: blur(15px); }
  to { filter: blur(0); } }

@keyframes slideIn { from { filter: blur(15px); }
  to { filter: blur(0); } }

@-webkit-keyframes slideOut { from { filter: blur(0); }
  to { filter: blur(15px); } }

@keyframes slideOut { from { filter: blur(0); }
  to { filter: blur(15px); } }