@charset "utf-8";
/*common-font*/
#edifice-concept h1 {
  font-size: min(6.5vw, 55px);
  padding: 0;
  line-height: 1.2;
  text-shadow: 0px 0px 9px #000000, 0px 0px 15px #000000;
}
#edifice-concept h2 {
  font-size: min(6vw, 45px);
  line-height: 1.2;
  padding: 0;
  margin-bottom: .5em;
  text-shadow: 0px 0px 9px #000000, 0px 0px 15px #000000;
}
#intelligence h2 {
  font-size: min(10vw, 100px);
}
#edifice-concept .cmp-product-navigation__ttl {
  font-size: 24px;
  margin-bottom: 0px;
}
#edifice-concept p {
  font-size: min(4.3vw, 20px);
  line-height: 1.5;
  text-shadow: 0px 0px 9px #000000, 0px 0px 15px #000000;
}
#intro .cmp-teaser__description p {
  font-size: min(3.8vw, 16px);
}
/*common-button*/
#edifice-concept .blue-btn.cmp-button {
  position: relative;
  font-weight: bold;
  border-radius: 12px;
  padding: 0px;
  cursor: pointer;
  color: #ffffff;
  background-color: #0a3282;
  border: none;
  transition: .3s ease-out;
}
/*common-other*/
#edifice-concept .cmp-swipe-carousel.swiper-horizontal .swiper-pagination-bullet-active {
  border: 2px solid #ffffff;
}
/*--arrow--*/
#edifice-concept .blue-btn.cmp-button::after {
  position: absolute;
  top: 50%;
  right: 2rem;
  content: '';
  display: inline-block;
  width: .5em;
  height: .5em;
  font-size: 1rem;
  min-height: auto;
  margin-top: -2px;
  margin-left: 10px;
  border-top: 2px solid;
  border-right: 2px solid;
  transform: rotate(45deg) translateY(-50%);
  border-color: #ffffff;
  transition: .3s ease-out;
}
#edifice-concept .blue-btn.cmp-button > .cmp-button__text {
  width: 80%;
  text-align: center;
}
#edifice-concept .blue-btn.cmp-button:hover {
  background-color: #ffffff;
  border: none;
  color: #0a3282;
  opacity: 1;
}
#edifice-concept .blue-btn.cmp-button:hover::after {
  border-color: #0a3282;
}
/*main*/
#edifice-concept {
  background-color: #000000;
}
#kv [id*="position-relative"] picture {
  display: flex;
  justify-content: flex-end;
}
#intelligence [id*="position-relative"] picture {
  display: flex;
  justify-content: center;
}
#racing-dna [id*="position-relative"] picture {
  display: flex;
  justify-content: flex-start;
}
#the-art-of-precision [id*="position-relative"] picture {
  display: flex;
  justify-content: flex-end;
}
/*text*/
[id*="position-relative"] {
  position: relative;
}
#edifice-concept .container:has(> .switch-container >[id*="position-absolute"][id*="text"]) {
  width: 50%;
  min-width: 700px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  padding: 0 10%;
}
#edifice-concept .switch-container:has(>[id*="position-absolute"][id*="text"]) {
  display: flex;
}
#edifice-concept #kv .switch-container:has(>[id*="position-absolute"][id*="text"]) {
  display: flex;
  justify-content: center;
}
#edifice-concept #intelligence .container:has(>.switch-container>[id*="position-absolute"][id*="text"]) {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  padding: 10px;
}
#edifice-concept #racing-dna .container:has(>.switch-container>[id*="position-absolute"][id*="text"]) {
  right: 0;
}
#edifice-concept #racing-dna .switch-container:has(>[id*="position-absolute"][id*="text"]) {
  display: flex;
  justify-content: flex-start;
}
/*kv*/
#kv .container:has(> .switch-container >[id*="position-absolute"][id*="logo"]) {
  width: 50%;
  position: absolute;
  bottom: 100px;
  padding: 0 10%;
}
#kv .switch-container:has(> [id*="logo"]) {
  display: flex;
  justify-content: center;
}
#kv #logo {
  width: 300px;
}
/*intro*/
#intro {
  max-width: 1200px;
  margin: 100px auto;
}
#intro__layout-row > .aem-Grid {
  display: flex;
  align-items: center;
  padding: 10px;
  justify-content: center;
}
#intro__layout-row > .aem-Grid > .container:nth-child(1) {
  width: 50%;
}
#intro__layout-row > .aem-Grid > .container:nth-child(2) {
  max-width: 300px;
  margin-left: 100px;
}
/*carousel*/
#intro [id^="carousel-wrapper"] button.carousel-controller {
    background: rgb(156 156 156 / 40%);
}
#intro [id^="carousel-wrapper"] button.carousel-controller:hover {
    background:rgb(221 221 221 / 70%)
}
#intro .products-title {
  font-size: min(6vw, 22px);
  width: 100%;
  text-align: center;
  display: block;
  font-weight: bold;
  margin-bottom: .5em;
}
#intro .products-description {
  width: 100%;
  min-width: auto;
  text-align: center;
}

@media (max-width: 767px) {
  #intro__layout-row > .aem-Grid {
    display: flex;
    flex-direction: column;
  }
  #edifice-concept [id*="position-relative"] img {
    min-width: auto;
  }
  /*text*/
  #racing-dna [id*="position-relative"], #the-art-of-precision [id*="position-relative"] {
    position: static;
  }
  #edifice-concept .container:has(> .switch-container >[id*="position-absolute"][id*="text"]) {
    width: 100%;
    min-width: auto;
    padding: 0 5%;
  }
  #edifice-concept #racing-dna .container:has(> .switch-container >[id*="position-absolute"][id*="text"]), #edifice-concept #the-art-of-precision .container:has(> .switch-container >[id*="position-absolute"][id*="text"]) {
    position: static;
    transform: translateY(0px);
    padding: 0 5% 10vw;
  }
  #edifice-concept #intelligence .container:has(>.switch-container>[id*="position-absolute"][id*="text"]) {
    width: 85%;
    margin: 0 auto;
  }
  /*kv*/
  #kv {
    height: 100vw;
  }
  #kv #logo {
    width: 100%;
    margin-top: 20px;
  }
  #edifice-concept #kv .switch-container:has(>[id*="position-absolute"][id*="text"]) {
    display: flex;
    justify-content: flex-start;
  }
  #kv .container:has(> .switch-container >[id*="position-absolute"][id*="logo"]) {
    width: 40%;
    position: absolute;
    left: 50%;
    bottom: -18vw;
    transform: translateX(-50%);
    padding: 0;
  }
  #kv .switch-container:has(> [id*="logo"]) {
    display: flex;
    justify-content: center;
  }
  #edifice-concept #kv .container:has(> .switch-container >[id*="position-absolute"][id*="text"]) {
    top: auto;
    bottom: 15vw;
    padding-left: 8%;
  }
  /*intro*/
  #intro {
    margin: 10vw auto;
  }
  #intro__layout-row > .aem-Grid > .container:nth-child(1) {
    width: 100%;
    padding: 0 5%;
  }
  #intro__layout-row > .aem-Grid > .container:nth-child(2) {
    max-width: none;
    width: 80%;
    margin: 20px auto 0 auto;
  }
  #intro__layout-row .cmp-teaser__content {
    top: 120vw !important;
    width: 100%;
  }
}