@charset "UTF-8";
/*
 * CSS Document
 * ==========================================================================
 * 版權所有 © 鉅潞科技網頁設計公司，並保留所有權利。
 * 網站地址: http://www.grnet.com.tw
 * ==========================================================================
 * $Subhead: ESG 頁底部形象影片區 $
 * */
.i-video {
  position: relative;
  width: 100%;
  z-index: 9;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  aspect-ratio: 1920/1080;
}
.i-video::before, .i-video::after {
  content: "";
  display: block;
  height: max(40px, 10vw);
  width: 100%;
  position: absolute;
  left: 0;
  z-index: 15;
  background-color: #fff;
  background-position: 0 0;
  background-repeat: repeat;
}
.i-video::before {
  top: 0;
  -webkit-mask-image: linear-gradient(to bottom, black 15%, transparent 95%);
          mask-image: linear-gradient(to bottom, black 15%, transparent 95%);
}
.i-video::after {
  bottom: 0;
  -webkit-mask-image: linear-gradient(to bottom, transparent 15%, black 95%);
          mask-image: linear-gradient(to bottom, transparent 15%, black 95%);
}
.i-video video,
.i-video .plyr,
.i-video iframe {
  z-index: 10;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.i-video img {
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (max-width: 991px) {
  .i-video {
    padding-bottom: 0;
  }
}

.i-video.is-bottom {
  aspect-ratio: 1920/980;
  overflow: hidden;
}
.i-video.is-bottom .plyr {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.i-video.is-bottom .plyr__video-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
  min-height: 100%;
  min-width: 177.78vh;
  aspect-ratio: 16/9 !important;
}
.i-video.is-bottom iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.i-video.is-bottom::before {
  height: max(15px, 8vw);
  background-color: transparent;
  background-image: linear-gradient(to top, transparent, #fff);
}
.i-video.is-bottom::after {
  display: none;
}
.i-video.is-bottom .i-video__sound-btn {
  position: absolute;
  right: max(15px, 1.5vw);
  bottom: max(15px, 1.5vw);
  z-index: 20;
}