/* JingTian pure water landing (ref: ganten product02_b, sections jt-1..jt-6) */
.jt-page section.pro { position: relative; }
.jt-page section.pro img { width: 100%; }
.jt-page .btn-a {
  display: inline-block;
  padding: 0.6vw 2.2vw;
  border: 1px solid #353535;
  font-size: 1.04vw;
  color: #333;
  text-decoration: none;
  transition: 0.2s;
}
.jt-page .btn-a:hover { background: #333; color: #fff; }

.jt-page section.pro.jt-1 { text-align: center; }
.jt-page section.pro.jt-1 h2 {
  font-size: 3.33vw;
  font-weight: bold;
  color: #fff;
  line-height: 3.91vw;
  margin-top: -22vw;
  margin-bottom: 1vw;
}
.jt-page section.pro.jt-1 p { font-size: 1.04vw; font-weight: 300; color: #fff; }
.jt-page section.pro.jt-1 img.bot { width: 43.39vw; margin-top: 4vw; }
.jt-page section.pro.jt-1 .a-wrap a { margin: 2vw 0 4.11vw; display: inline-block; }

.jt-page section.pro.jt-2 { text-align: center; background: #f4f4f4; padding-bottom: 3.49vw; }
.jt-page section.pro.jt-2 h2.title {
  margin-top: -23vw;
  font-size: 3.33vw;
  font-weight: 900;
  color: #fff;
  line-height: 5.21vw;
  margin-bottom: 3vw;
}
.jt-page section.pro.jt-2 video { width: 69.84vw; border-radius: 8px; }
.jt-page section.pro.jt-2 .video-box { margin-bottom: 3vw; }
.jt-page section.pro.jt-2 .video-wrap { display: none; }
.jt-page section.pro.jt-2 .video-wrap.active { display: block; }
.jt-page section.pro.jt-2 ul.tabs {
  display: flex;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
.jt-page section.pro.jt-2 ul.tabs li {
  padding: 1.46vw 6.25vw;
  background: #fff;
  border: 1px solid #353535;
  margin: 0 5.8vw;
  min-width: 21.88vw;
  cursor: pointer;
}
.jt-page section.pro.jt-2 ul.tabs li.active,
.jt-page section.pro.jt-2 ul.tabs li:hover {
  transition: 0.2s;
  background: #5a7fce;
  color: #fff;
  border: 1px solid #5a7fce;
}

.jt-page section.pro.jt-3 { text-align: center; padding-top: 4.53vw; position: relative; }
.jt-page section.pro.jt-3::after {
  content: "";
  width: 100vw;
  height: 17.24vw;
  background: #484848;
  position: absolute;
  bottom: 0;
  z-index: -1;
  left: 50%;
  transform: translateX(-50%);
}
.jt-page section.pro.jt-3 h2 { font-size: 3.33vw; font-weight: bold; color: #313131; line-height: 3.91vw; }
.jt-page section.pro.jt-3 p.desc {
  max-width: 36vw;
  font-size: 1.04vw;
  font-weight: 300;
  color: #313131;
  line-height: 1.88vw;
  display: inline-block;
  margin-top: 1vw;
}
.jt-page section.pro.jt-3 .b-box {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0 8vw 1vw;
  color: #fff;
  font-size: 0.83vw;
}
.jt-page section.pro.jt-3 .b-box img { margin-bottom: 2.5vw; }
.jt-page section.pro.jt-3 .b-box > div {
  padding: 2vw;
  line-height: 2;
  flex: 0 0 auto;
  width: 14%;
  min-width: 120px;
  box-sizing: border-box;
}

.jt-page section.pro.jt-4 { position: relative; text-align: center; padding-bottom: 4.58vw; }
.jt-page section.pro.jt-4 p.p1 {
  position: absolute;
  top: 1.77vw;
  right: 9.43vw;
  width: 18.18vw;
  font-size: 1.04vw;
  font-weight: 300;
  color: #fff;
  text-align: left;
}
.jt-page section.pro.jt-4 h2.h21 {
  position: absolute;
  width: 6.98vw;
  font-size: 3.33vw;
  font-weight: bold;
  color: #000;
  line-height: 3.75vw;
  right: 20.52vw;
  top: 11.8vw;
  writing-mode: vertical-lr;
  text-indent: 2em;
}
.jt-page section.pro.jt-4 h2.h22 {
  font-size: 3.33vw;
  font-weight: bold;
  color: #000;
  line-height: 5.21vw;
  margin: 5.6vw 0 0;
}
.jt-page section.pro.jt-4 p.p2 {
  font-size: 1.04vw;
  font-weight: 300;
  color: #000;
  line-height: 5.21vw;
  margin-bottom: 1.5vw;
}
.jt-page section.pro.jt-4 video { width: 66.67vw; border-radius: 8px; }

.jt-page section.pro.jt-5 { text-align: center; padding-bottom: 17vw; }
.jt-page section.pro.jt-5 h2 {
  margin-top: -25.6vw;
  font-size: 3.33vw;
  font-weight: bold;
  color: #fff;
  line-height: 1.2;
}
.jt-page section.pro.jt-5 p { font-size: 1.04vw; font-weight: 400; color: #fff; line-height: 7.81vw; }

.jt-page section.pro.jt-6 { padding-bottom: 4vw; text-align: center; }
.jt-page section.pro.jt-6 h2 { font-size: 3.33vw; font-weight: bold; color: #0a0a0a; line-height: 7.81vw; margin-top: 5vw; }
.jt-page section.pro.jt-6 p.sub { font-size: 1.25vw; font-weight: 200; color: #0a0a0a; }
.jt-page section.pro.jt-6 h3 { font-size: 1.88vw; font-weight: bold; color: #fff; position: absolute; }
.jt-page section.pro.jt-6 h3 small { font-size: 1.25vw; font-weight: 300; display: block; }
.jt-page section.pro.jt-6 dl { margin-top: 5vw; display: flex; justify-content: center; padding: 0 15.77vw; }
.jt-page section.pro.jt-6 dl dd { margin: 0 1vw; position: relative; border-radius: 10px; }
.jt-page section.pro.jt-6 .img-wrap { margin: 2.55vw 16.77vw; position: relative; }
.jt-page section.pro.jt-6 .h31,
.jt-page section.pro.jt-6 .h32 { top: 3.85vw; right: 2.6vw; }
.jt-page section.pro.jt-6 .h33 { top: 13.23vw; left: 7.86vw; }
.jt-page section.pro.jt-6 .h34 { top: 6.6vw; left: 7.86vw; color: #5a7fce; }
.jt-page section.pro.jt-6 .h35 { color: #5a7fce; top: 6.6vw; right: 7.86vw; }

@media screen and (max-width: 768px) {
  .jt-page section.pro.jt-1 h2 { margin-top: -12vw; font-size: 6vw; }
  .jt-page section.pro.jt-1 p { font-size: 3vw; }
  .jt-page section.pro.jt-1 img.bot { width: 70vw; }
  .jt-page section.pro.jt-2 h2.title { margin-top: -40vw; font-size: 5vw; }
  .jt-page section.pro.jt-2 video { width: 94vw; }
  .jt-page section.pro.jt-2 ul.tabs { flex-direction: column; align-items: center; gap: 2vw; }
  .jt-page section.pro.jt-2 ul.tabs li { margin: 0; min-width: 60vw; }
  .jt-page section.pro.jt-3 .b-box > div { width: 45%; }
  .jt-page section.pro.jt-4 p.p1 { position: static; width: auto; color: #333; padding: 2vw; }
  .jt-page section.pro.jt-4 h2.h21 { position: static; writing-mode: horizontal-tb; width: auto; margin: 2vw auto; }
  .jt-page section.pro.jt-4 video { width: 94vw; }
  .jt-page section.pro.jt-5 h2 { margin-top: -50vw; }
  .jt-page section.pro.jt-6 dl { flex-direction: column; padding: 0 4vw; }
  .jt-page .btn-a { font-size: 3.5vw; padding: 2vw 6vw; }
}