/* ********************** */
/* HERO SECTION */
/* ********************** */
.hero-video {
  padding-top: calc(100vw * 178 / 1920);
}

.video-img {
  width: calc(100vw * 1331 / 1920);
  height: calc(100vw * 795 / 1920);
}

.video-img img {
  width: 100%;
  opacity: 1;
  transition: all 0.5s;
  cursor: pointer;
}

.video-img.active img {
  transform: scale(0);
  opacity: 0;
}

.video-box {
  width: calc(100vw * 1331 / 1920);
  height: calc(100vw * 795 / 1920);
  transform: translate(-50%, 0%) scale(0);
  opacity: 0;
  transition: all 0.5s;
  transition-delay: 0.5s;
  position: absolute;
  left: 50%;
}

.video-box.active {
  transform: translate(-50%, 0%) scale(1);
  opacity: 1;
}

/* ********************** */
/* PRODUCTION SECTION */
/* ********************** */
.production-section {
  margin-top: calc(100vw * 164 / 1920);
  gap: calc(100vw * 37 / 1920);
}

.production-equipment {
  gap: calc(100vw * 40 / 1920);
}

.production-box {
  width: 100%;
}

.production-content-box {
  width: 50%;
}

.production-box img {
  width: 50%;
}

.production-content-box {
  background-color: #e6212a;
  padding-top: calc(100vw * 80 / 1920);
  padding-bottom: calc(100vw * 80 / 1920);
  padding-left: calc(100vw * 45 / 1920);
  padding-right: calc(100vw * 45 / 1920);
  gap: calc(100vw * 43 / 1920);
}

.production-content-box p {
  font-size: calc(100vw * 15.5 / 1920);
  color: #fff;
}

.production-content-first {
  text-indent: calc(100vw * 31 / 1920);
}

.equipment-img-box {
  justify-content: space-between;
}

.equipment-img-box img {
  width: calc(100vw * 408 / 1920);
}

/* ********************** */
/* ENTERPRISE SECTION */
/* ********************** */
.enterprise-section {
  margin-top: calc(100vw * 159 / 1920);
  gap: calc(100vw * 88 / 1920);
}

.enterprise-qualification {
  gap: calc(100vw * 200 / 1920);
}

:root{
    --maxHeight: 0;
}

.enterprise-box {
  width: calc(100vw * 638 / 1920);
  height: calc(100vw * var(--maxHeight) / 1920);
}

.enterprise-content-box {
  width: 100%;
  gap: calc(100vw * 26 / 1920);
}

.enterprise-content-box p {
  font-size: calc(100vw * 21 / 1920);
  line-height: calc(100vw * 21 / 1920);
}

.enterprise-images-box {
  width: calc(100vw * 511 / 1920);
  height: calc(100vw * var(--maxHeight) / 1920);
  position: relative;
  overflow: hidden;
}

.enterprise-images-box img{
    cursor: url("../img/logo/zoom-in-regular-24.png"), zoom-in;
}

.image-first {
  position: absolute;
  top: 100%;
  width: calc(100vw * 511 / 1920);
  height: calc(100vw * var(--maxHeight) / 1920);
}

.image-second {
  position: absolute;
  top: 100%;
}

.image-first img {
  width: 100%;
}

.image-second .image {
  width: calc(100vw * 511 / 1920);
  height: calc(100vw * var(--maxHeight) / 1920);
}

.image-second .image img {
  width: 100%;
}

/* ********************** */
/* RESEARCH SECTION */
/* ********************** */
.research-section {
  margin-top: calc(100vw * 102 / 1920);
  gap: calc(100vw * 37 / 1920);
}

.search-development {
  gap: calc(100vw * 40 / 1920);
}

.search-box {
  width: 100%;
}

.search-content-box {
  width: 50%;
}

.search-box img {
  width: 50%;
}

.search-content-box {
  background-color: #e6212a;
  padding-top: calc(100vw * 80 / 1920);
  padding-bottom: calc(100vw * 80 / 1920);
  padding-left: calc(100vw * 45 / 1920);
  padding-right: calc(100vw * 45 / 1920);
}

.search-content-box p {
  font-size: calc(100vw * 15.5 / 1920);
  color: #fff;
  text-indent: calc(100vw * 31 / 1920);
}

.search-img-box {
  justify-content: space-between;
}

.search-img-box img {
  width: calc(100vw * 408 / 1920);
}

/* ********************** */
/* EXPERT SECTION */
/* ********************** */
.expert-section {
  margin-top: calc(100vw * 148 / 1920);
  margin-bottom: calc(100vw * 100 / 1920);
  gap: calc(100vw * 37 / 1920);
}

.expert-cooperation {
  gap: calc(100vw * 40 / 1920);
}

.expert-box {
  width: 100%;
}

.expert-content-box {
  width: 50%;
}

.expert-box img {
  width: 50%;
}

.expert-content-box {
  background-color: #e6212a;
  padding-top: calc(100vw * 80 / 1920);
  padding-bottom: calc(100vw * 80 / 1920);
  padding-left: calc(100vw * 45 / 1920);
  padding-right: calc(100vw * 45 / 1920);
}

.expert-content-box p {
  font-size: calc(100vw * 15.5 / 1920);
  color: #fff;
  text-indent: calc(100vw * 31 / 1920);
}

.expert-img-box {
  justify-content: space-between;
}

.expert-img-box img {
  width: calc(100vw * 408 / 1920);
}

/* ********************** */
/* IMAGE MASK */
/* ********************** */
.image-mask {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0);
    left: 0;
    top: 0;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: all 1s;
}

.image-mask.active {
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 1;
    visibility: visible;
}

.animated-image-container {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: all 1s;
}

.animated-image-container.active {
    transform: translate(-50%, -50%) scale(1);
}

.animated-image {
    height: 80vh;
}

.image-mask svg {
    position: absolute;
    stroke: #fff;
    cursor: pointer;
    width: calc(100vw * 36 / 1920);
    height: calc(100vw * 36 / 1920);
    right: calc(100vw * -36 / 1920);
    top: calc(100vw * -36 / 1920);
}