.product-hero {
  position: relative;
  height: auto !important;
  display: block; }

.product-hero img {
  width: 100%; }

.product-hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  top: 65%;
  /*@if is-direction($direction) == false {
    $color-stops: $direction, $color-stops;
    $direction: 180deg;
  }*/
  background: rgba(0, 0, 0, 0.5);
  background: -webkit-gradient(linear, left bottom, left top, color-stop(50%, rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0));
  background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0));
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0, 0, 0, 0.5) 50%', endColorstr='rgba(0, 0, 0, 0)',GradientType=1 ); }

@media (max-width: 59.99em) {
  .product-hero {
    margin-top: 53px; }
  .product-hero::before {
    top: 40%;
    /*@if is-direction($direction) == false {
    $color-stops: $direction, $color-stops;
    $direction: 180deg;
  }*/
    background: rgba(0, 0, 0, 0.3);
    background: -webkit-gradient(linear, left bottom, left top, color-stop(50%, rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0)));
    background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0));
    background: linear-gradient(to top, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0));
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0, 0, 0, 0.3) 50%', endColorstr='rgba(0, 0, 0, 0)',GradientType=1 ); } }

@media (min-width: 60em) {
  .product-hero {
    margin-top: 42px; } }

.product-hero__thumb {
  position: absolute;
  z-index: 5;
  top: 5%;
  right: 3%;
  width: 50%;
  text-align: right; }

@media (min-width: 60em) {
  .product-hero__thumb {
    top: auto;
    bottom: 5%;
    width: 35%; } }

.product-hero__cont {
  position: absolute;
  z-index: 5;
  left: 5%;
  bottom: 5%;
  text-align: left; }

.product-hero__cont .title {
  color: #fff;
  font-size: 6rem;
  letter-spacing: -1.2px;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5); }

.product-hero__cont .s-title {
  color: #fff;
  font-size: 3rem;
  letter-spacing: -1px;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5); }

@media (min-width: 60em) {
  .product-hero__cont {
    bottom: 10%; }
  .product-hero__cont .title {
    font-size: 8rem; }
  .product-hero__cont .s-title {
    font-size: 4rem; } }

@media (min-width: 75em) {
  .product-hero__cont .title {
    font-size: 10rem; }
  .product-hero__cont .s-title {
    font-size: 5rem; } }

.movie-wrap {
  position: relative;
  overflow: hidden;
  padding-bottom: 56.25%; }

.movie-visual {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }

.movie-visual img,
.movie-visual video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  vertical-align: top; }

.no-objectfit .movie-visual img, .no-objectfit
.movie-visual video {
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  min-width: 100%;
  min-height: 100%;
  max-width: none !important;
  width: auto !important;
  height: auto !important;
  -webkit-transform: translate3d(-50%, -50%, 0) !important;
          transform: translate3d(-50%, -50%, 0) !important; }

hr.hr {
  max-width: 180px;
  margin: 0 auto;
  border-top: 1px solid #e5e5e5; }

.prd-section .thumb {
  text-align: center; }

.prd-section .thumb img {
  width: 100%; }