@import '../resources/fonts/fonts.css';
#efevc-introduction {
  box-sizing: border-box;
}
#efevc-introduction *,
#efevc-introduction *::before,
#efevc-introduction *::after {
  box-sizing: inherit;
}
#efevc-introduction * {
  -webkit-touch-callout: none;
  user-select: none;
}
#efevc-introduction {
  position: relative;
  overflow-x: hidden;
  width: 100%;
  font-family: Heiti, "Microsoft Yahei", Helvetica, Arial, sans-serif;
}
#efevc-introduction .main-container {
  position: relative;
  width: 1440px;
  left: 50%;
  margin-left: -720px;
}
#efevc-introduction .only-mobile {
  display: none;
}
#efevc-introduction .section-1 {
  position: relative;
  overflow: hidden;
}
#efevc-introduction .section-1 .color-block {
  position: absolute;
  top: 146px;
  left: 136px;
  width: 205px;
  height: 50%;
  background-color: #0078ff;
}
#efevc-introduction .section-1 .content {
  position: relative;
  margin-top: 74px;
  margin-left: 136px;
  margin-bottom: 27px;
  z-index: 2;
  padding-left: 124px;
}
#efevc-introduction .section-1 .title {
  width: 369px;
  font-family: HelveticaNeueLTPro-Bd, Heiti, "Microsoft Yahei", Helvetica, Arial, sans-serif;
  font-size: 46px;
  line-height: 1;
  color: #000000;
  text-transform: uppercase;
}
#efevc-introduction .section-1 .description {
  width: 265px;
  font-family: Georgia, Times, "Times New Roman", Heiti, "Microsoft Yahei", Helvetica, Arial, sans-serif;
  font-size: 20px;
  font-weight: normal;
  font-style: italic;
  font-stretch: normal;
  line-height: 1.2;
  color: #000000;
  margin: 30px 0;
}
#efevc-introduction .section-1 .QRCode {
  width: 130px;
  height: 130px;
  border: solid 4px #ffffff;
}
#efevc-introduction .section-1 .devices {
  margin-top: 58px;
  font-size: 0;
}
#efevc-introduction .section-1 .ios,
#efevc-introduction .section-1 .android {
  display: inline-block;
  width: 168px;
  height: 47px;
  line-height: 47px;
  text-align: center;
  font-size: 0;
  border-radius: 4px;
  border: solid 1px #000000;
  cursor: pointer;
}
#efevc-introduction .section-1 .ios {
  margin-right: 18px;
}
#efevc-introduction .section-1 .ios-icon {
  display: inline-block;
  width: 22px;
  height: 100%;
  margin-top: -2px;
  vertical-align: top;
  background: url(../resources/icons/ios-icon.png) center / contain no-repeat;
}
#efevc-introduction .section-1 .android-icon {
  display: inline-block;
  width: 22px;
  height: 100%;
  vertical-align: top;
  background: url(../resources/icons/android-icon.png) center / contain no-repeat;
}
#efevc-introduction .section-1 .text {
  display: inline-block;
  font-family: Arial, sans-serif;
  font-size: 20px;
  color: #000000;
  margin-left: 10px;
}
#efevc-introduction .section-1 .comment {
  margin-top: 17px;
  font-family: HelveticaNeueLTPro-Roman, Heiti, "Microsoft Yahei", Helvetica, Arial, sans-serif;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.6px;
  text-align: left;
  color: #424242;
}
#efevc-introduction .section-1 .device-image-container {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 890px;
  height: 525px;
}
#efevc-introduction .section-1 .device-image-container .ipad-image {
  position: absolute;
  width: 811px;
  height: 471px;
  background: url(../resources/images/ipad.png) center / cover no-repeat;
  right: 0;
  top: 0;
}
#efevc-introduction .section-1 .device-image-container .iphone-image {
  position: absolute;
  width: 484px;
  height: 296px;
  background: url(../resources/images/iphone.png) center / cover no-repeat;
  left: 0;
  bottom: 0;
}
#efevc-introduction .section-2 {
  height: 667px;
  position: relative;
  background: url(../resources/images/background-section-2.png) center / cover no-repeat;
}
#efevc-introduction .section-2 .rectangle {
  color: white;
  position: absolute;
  right: 278px;
  width: 433px;
  top: 50%;
  transform: translateY(-50%);
}
#efevc-introduction .section-2 .rectangle .rectangle-top,
#efevc-introduction .section-2 .rectangle .rectangle-bottom {
  width: 370px;
  height: 60px;
  border: 1px solid white;
  float: right;
}
#efevc-introduction .section-2 .rectangle .rectangle-top {
  border-bottom: none;
}
#efevc-introduction .section-2 .rectangle .rectangle-bottom {
  border-top: none;
}
#efevc-introduction .section-2 .rectangle .rectangle-middle {
  float: left;
  width: 100%;
  padding: 40px 20px 40px 0;
  font-family: HelveticaNeueLTPro-Bd, Heiti, "Microsoft Yahei", Helvetica, Arial, sans-serif;
  font-size: 34px;
  line-height: 1;
  border-right: 1px solid white;
  text-transform: uppercase;
}
#efevc-introduction .section-3 {
  height: 510px;
  position: relative;
}
#efevc-introduction .section-3 .text {
  position: absolute;
  top: 189px;
  left: 301px;
  width: 370px;
  font-family: HelveticaNeueLTPro-Bd, Heiti, "Microsoft Yahei", Helvetica, Arial, sans-serif;
  font-size: 30px;
  line-height: 1.07;
  color: #000000;
  text-transform: uppercase;
}
#efevc-introduction .section-3 .talking-image {
  position: absolute;
  right: 253px;
  top: 129px;
  width: 444px;
  height: 281px;
  background: url(../resources/images/talking-section-3.png) center / cover no-repeat;
}
