@import "./base.css";

.index-page-video {
  /* height: 100%; */
  height: 100vh;
  position: relative;
}
.index-page-ie-mask {
  display: none;
  display: block\0;
  z-index: -200;
  width: 100%;
  height: 100vh;
  background-color: gray;
  position: absolute;
  top: 0;
}
video#videoBg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  height: auto\0;
  width: 100%;
  object-fit: cover;
  object-position: 100% 0%;
}
.index-video-wrapper {
  position: fixed;
  top: 0;
  height: 100vh;
  width: 100%;
  transform: rotate(0);
  z-index: -100;
}
.index-page-video-img {
  height: 100%;
  width: 100%;
  background-size: cover;
  object-position: 100% 0%;
  object-fit: cover;
}
.index-title-wrapper {
  position: absolute;
  bottom: 88px; /* px */
  width: 100%;
  color: white;
}

.index-portfolio {
  box-sizing: border-box;
  width: 100%;
  height: 700px; /* px */
  background: white;
}
.en .index-portfolio {
  height: 620px; /* px */
}
.index-portfolio-limitw {
  height: 100%;
  position: relative;
}

.index-summary-wrapper {
  padding-top: 160px; /* px */
}
.index-summary-logo {
  position: absolute;
  background: url('/static/img/yellow-mask.svg') no-repeat;
  background-size: contain;
  width: 25%;
  max-width: 420px; /* px */
  padding-bottom: 25%;
  z-index: 1;
}
.index-summary-bg.left-bg {
  z-index: auto;
  margin-top: 80px; /* px */
  background: none;
}

.index-summary-content {
  position: relative;
  margin-top: -80px; /* px */
  padding-top: 10%;
  box-sizing: border-box;
  overflow: hidden;
  /* z-index: -1; */
  /* background:  rgba(246, 246, 246, 0.88); */
}
.index-summary-title,
.index-summary-subtitle,
.index-summary-knowmore {
  margin-left: 40%;
  z-index: 1;
}
.en .index-summary-title {
  top: 16px; /* px */
}
.index-summary-subtitle {
  padding: 30px 0; /* px */
}

.en .index-summary-subtitle {
  padding-top: 1px; /* px */
}
.en .index-summary-portfolio-summary {
  font-size: 16px; /* px */
}
.index-responsive-summary {
  padding-top: 80px; /* px */
}
.index-responsive-summary-number-wrapper {
  width: 70%;
  float: left;
  margin-left: -4%;
}
.index-number-cell {
  display: inline-block;
  margin-left: 8%; 
  padding-top: 32px; /* px */
  width: 42%;
  border-top:  1px solid #807c7a; /* no */
  margin-bottom: 84px; /* px */
}
.index-cell-name {
  font-size: 20px; /* px */
  color: #444;
  font-weight: 300;
  height: 38px; /* px */
}
.index-cell-value {
  color: #444;
  font-size: 72px; /* px */
  position: relative;
}
.index-summary-portfolio-summary {
  float: left;
  width: 31%;
  margin-left: 3%;
  font-size: 18px; /* px */
  color: #444;
  font-weight: 300;
  line-height: 180%;
}
/* .en .index-summary-portfolio-summary {
  text-align: left;
} */

.index-cell-value .sub {
  font-weight: 300;
  font-size: 24px; /* px */
  margin-left: 4px; /* px */
}

.index-team-wrapper {
  padding-top: 60px; /* px */
}
.index-team-title {
  float: right;
}
.index-team-subtitle {
  padding-top: 80px; /* px */
  width: 60%;
}
.en .index-team-subtitle {
  padding-top: 1px; /* px */
}
.index-team-knowmore {
  padding: 40px 0; /* px */
}
.index-team-img {
  width: 80%;
  padding-bottom: 55%;
  margin-left: 21%;
  background-size: cover;
}

.index-news-title {
  margin-bottom: -36px; /* px */
  width: 500px; /* px */
}
.index-news-wrapper {
  padding-bottom: 80px; /* px */
}


.index-news-wrapper .limitw {
  margin-top: 120px; /* px */
}
.index-news-knowmore {
  float: right;
}
#threeD {
  /* margin-left: -5%; */
  cursor: ew-resize;
  margin: 0 auto;
  max-width: 1400px; /* px */
}
@media screen and (max-width: 780px) {
  .index-page div.index-portfolio.index-page-common {
    padding:  0; /* px */
  }
  .index-portfolio {
    height: 700px; /* px */
  }

  .index-news-wrapper.index-page-common #threeD {
    margin: 0;
    margin-top: 64px; /* px */
  }
  .en .index-portfolio {
    height: 695px; /* px */
  }
  .index-news-wrapper.index-page-common #threeD canvas {
    transform: translatex(-25%);
  }
}
#threeD canvas {
  /* width: 100% !important; */
  /* margin: 0 auto; */
}

.index-ronghui-wrapper.index-page-common {
  width: 100%;
  padding: 64px 0 80px; /* px */
  background: #F6F6F6;
  position: relative;
  overflow: visible;
}

.index-ronghui-title {
  margin-top: -220px; /* px */
  float: right;
}
.en .index-ronghui-title {
  margin-top: -210px; /* px */
}

.index-ronghui-subtitle {
  width: 60%;
}
.index-ronghui-img {
  width: 100%;
  padding-bottom: 37%;
  margin-top: 80px; /* px */
  margin-bottom: 48px; /* px */
  background-position: center;
  background-size: cover;
  position: relative;
}
.index-ronghui-img::after {
  content: '';
  position: absolute;
  right: 0;
  height: 100%;
  width: 6%;
  display: block;
  background-size: cover;
  background-image: url('/static/img/ronghui-mask-right.svg');
}
.index-ronghui-img::before {
  content: '';
  position: absolute;
  left: -1px;
  top: -1%;
  height: 102%;
  width: 100%;
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url('/static/img/ronghui-mask-left.svg');
}
.index-ronghui-knowmore {
  margin: 30px 0; /* px */
}
