/**载入字体
@font-face{font-family:"OPPOSans-B";src:url(original.ui.files/resources/fonts/OPPOSans-B.woff2) format("woff2"),url(original.ui.files/resources/fonts/OPPOSans-B.woff) format("woff"),url(original.ui.files/resources/fonts/OPPOSans-B.ttf) format("truetype"),url(original.ui.files/resources/fonts/OPPOSans-B.svg) format("svg"),url(original.ui.files/resources/fonts/OPPOSans-B.eot) format("embedded-opentype");font-weight:200;font-style:normal}
@font-face{font-family:"OPPOSans-M";src:url(original.ui.files/resources/fonts/OPPOSans-M.woff2) format("woff2"),url(original.ui.files/resources/fonts/OPPOSans-M.woff) format("woff"),url(original.ui.files/resources/fonts/OPPOSans-M.ttf) format("truetype"),url(original.ui.files/resources/fonts/OPPOSans-M.svg) format("svg"),url(original.ui.files/resources/fonts/OPPOSans-M.eot) format("embedded-opentype");font-weight:200;font-style:normal}
@font-face{font-family:"";src:url(original.ui.files/resources/fonts/OPPOSans-R.woff2) format("woff2"),url(original.ui.files/resources/fonts/OPPOSans-R.woff) format("woff"),url(original.ui.files/resources/fonts/OPPOSans-R.ttf) format("truetype"),url(original.ui.files/resources/fonts/OPPOSans-R.svg) format("svg"),url(original.ui.files/resources/fonts/OPPOSans-R.eot) format("embedded-opentype");font-weight:200;font-style:normal}
@font-face{font-family:"OPPOSans-H";src:url(original.ui.files/resources/fonts/OPPOSans-H.woff2) format("woff2"),url(original.ui.files/resources/fonts/OPPOSans-H.woff) format("woff"),url(original.ui.files/resources/fonts/OPPOSans-H.ttf) format("truetype"),url(original.ui.files/resources/fonts/OPPOSans-H.svg) format("svg"),url(original.ui.files/resources/fonts/OPPOSans-H.eot) format("embedded-opentype");font-weight:200;font-style:normal}
@font-face{font-family:"OPPOSans-L";src:url(original.ui.files/resources/fonts/OPPOSans-L.woff2) format("woff2"),url(original.ui.files/resources/fonts/OPPOSans-L.woff) format("woff"),url(original.ui.files/resources/fonts/OPPOSans-L.ttf) format("truetype"),url(original.ui.files/resources/fonts/OPPOSans-L.svg) format("svg"),url(original.ui.files/resources/fonts/OPPOSans-L.eot) format("embedded-opentype");font-weight:200;font-style:normal}
**/
  @font-face {
    font-family: "OPPOSans-B";
    src: url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.woff2) format("woff2"), url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.woff) format("woff"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.ttf) format("truetype"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.svg) format("svg"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.eot) format("embedded-opentype");
  }
  @font-face {
    font-family: "OPPOSans-H";
    src: url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.woff2) format("woff2"), url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.woff) format("woff"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.ttf) format("truetype"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.svg) format("svg"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-B.eot) format("embedded-opentype");
  }
  @font-face {
    font-family: "OPPOSans-M";
    src: url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-M.woff2) format("woff2"), url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-M.woff) format("woff"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-M.ttf) format("truetype"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-M.svg) format("svg"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-M.eot) format("embedded-opentype");
  }
  @font-face {
    font-family: "";
    src: url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-R.woff2) format("woff2"), url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-R.woff) format("woff"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-R.ttf) format("truetype"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-R.svg) format("svg"),
      url(https://dsfs.oppo.com/aemstatic/fonts/OPPOSans-R.eot) format("embedded-opentype");
  }

@font-face {
  font-family: 'iconfont';  /* project id 2177710 */
  src: url('//at.alicdn.com/t/font_2177710_fmgyicpapta.eot');
  src: url('//at.alicdn.com/t/font_2177710_fmgyicpapta.eot?#iefix') format('embedded-opentype'),
  url('//at.alicdn.com/t/font_2177710_fmgyicpapta.woff2') format('woff2'),
  url('//at.alicdn.com/t/font_2177710_fmgyicpapta.woff') format('woff'),
  url('//at.alicdn.com/t/font_2177710_fmgyicpapta.ttf') format('truetype'),
  url('//at.alicdn.com/t/font_2177710_fmgyicpapta.svg#iconfont') format('svg');
}
/**设置跟元素字体为10px,以后用到rem后 12px＝1.2rem了  记得加上px免得不兼容**/
html
{
  font-size:62.5%; /* 10÷16=62.5% */
}
@media (min-width: 1280px) and (max-width: 1440px) 
{
  html
  {
    font-size:38.5%; /* 10÷16=62.5% */
  }
}
body
{ 
  -webkit-font-smoothing:subpixel-antialiased;
  font-family: ""; 
  font-size:14px; 
}
a:hover
{
  -webkit-font-smoothing:subpixel-antialiased;
}
.iconfont{
    font-family:"iconfont" !important;
    font-size:16px;font-style:normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
    -moz-user-select:none;
   -ms-user-select: none;
   -webkit-user-select: none;
   user-select: none;
}
input::-webkit-input-placeholder{
      color:#9E9E9E;
  }
  input::-moz-placeholder{   /* Mozilla Firefox 19+ */
      color:#9E9E9E;
  }
  input:-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
      color:#9E9E9E;
  }
  input:-ms-input-placeholder{  /* Internet Explorer 10-11 */ 
      color:#9E9E9E;
  }
/**颜色**/
.zhuce-1
{
  color: #38bab8;
}
.zhuce-2
{
  color: #E5EFFF;
}
.dianzhui-1
{
  color: #FFC400;
}
.dianzhui-2
{
  color: #FFF3CC;
}
.dianzhui-3
{
  color: #FF1744;
}
.dianzhui-4
{
  color: #FFE3E8;
}
.fuzhu-1
{
  color: #424242;
}
.fuzhu-2
{
  color: #757575;
}
.fuzhu-3
{
  color: #BDBDBD;
}
.fuzhu-4
{
  color: #EEEEEE;
}
.fuzhu-5
{
  color: #FAFAFA;
}
.fuzhu-6
{
  color: #FFFFFF;
}
/**字体**/
.ziti100
{
  font-family: "OPPOSans-B"; 
  font-size:100px; 
  line-height: 100px;
  /**font-weight: bold;**/
}
.ziti88
{
  font-family: "OPPOSans-B"; 
  font-size:88px; 
  line-height: 88px;
  /**font-weight: bold;**/
}
.ziti80
{
  font-family: "OPPOSans-B"; 
  font-size:80px; 
  line-height: 80px;
  /**font-weight: bold;**/
}
.ziti72
{
  font-family: "OPPOSans-B"; 
  font-size:72px; 
  line-height: 72px;
  /**font-weight: bold;**/
}
.ziti60
{
  font-family: "OPPOSans-B"; 
  font-size:60px; 
  line-height: 60px;
  /**font-weight: bold;**/
}
.ziti52
{
  font-family: "OPPOSans-B"; 
  font-size:52px; 
  line-height: 52px;
  /**/**font-weight: bold;**/**/
}
.ziti36
{
  font-family: "OPPOSans-B"; 
  font-size:36px; 
  line-height: 36px;
  /**font-weight: bold;**/
}
.ziti32
{
  font-family: "OPPOSans-B"; 
  font-size:32px; 
  line-height: 32px;
  /**font-weight: bold;**/
}
.zitir32
{
  font-family: ""; 
  font-size:32px; 
  line-height: 32px;
}
.ziti28
{
  font-family: "OPPOSans-B"; 
  font-size:28px; 
  line-height: 28px;
  /**font-weight: bold;**/
}
.zitir28
{
  font-family: ""; 
  font-size:28px; 
  line-height: 28px;
}
.ziti24
{
  font-family: "OPPOSans-B"; 
  font-size:24px; 
  line-height: 24px;
  /**font-weight: bold;**/
}
.zitir24
{
  font-family: ""; 
  font-size:24px;
  line-height: 24px; 
}
.ziti20
{
  font-family: "OPPOSans-B"; 
  font-size:20px; 
  line-height: 20px;
  /**font-weight: bold;**/
}
.zitir20
{
  font-family: ""; 
  font-size:20px; 
  line-height: 20px;
}
.zitir16
{
  font-family: ""; 
  font-size:16px; 
  line-height: 16px;
}
.zitir12
{
  font-family: ""; 
  font-size:12px; 
  line-height: 12px;
}
/**间距**/
.jianju-1
{
  margin-top: 60px;
}
.jianju-2
{
  margin-top: 40px;
}
.jianju-3
{
  margin-top: 80px;
}
.jianju-4
{
  margin-top: 32px;
}
.lanse
{
  background:url('../images/lanse.png') no-repeat left bottom;
  background-size:100% 100%;
  transition-property: all;
  transition-duration: 0.5s;
}
.lanse:hover
{
  background:url('../images/lanse.png') no-repeat left bottom;
  background-size:100% 100%;
}
.huangse
{
  background:url('../images/huangse.png') no-repeat left bottom;
  background-size:100% 100%;
  transition-property: all;
  transition-duration: 0.5s;
}
.huangse:hover
{
  background:url('../images/huangse.png') no-repeat left bottom;
  background-size:100% 100%;
}
.hongse
{
  background:url('../images/hongse.png') no-repeat left bottom;
  background-size:100% 100%;
  transition-property: all;
  transition-duration: 0.5s;
}
.hongse:hover
{
  background:url('../images/hongse.png') no-repeat left bottom;
  background-size:100% 100%;
}
.baise
{
  background:url('../images/baises.png') no-repeat left bottom;
  background-size:100% 100%;
  transition-property: all;
  transition-duration: 0.5s;
}
.baise:hover
{
  background:url('../images/baises.png') no-repeat left bottom;
  background-size:100% 100%;
}
video{
  /*min-width: 100%;*/
  /*min-height: 100%;*/
  height: auto;
  width: auto;
  /*加滤镜*/
  /*-webkit-filter: grayscale(100%);*/
  /*filter:grayscale(100%);*/
}
source{
  min-width: 100%;
  min-height: 100%;
  height: auto;
  width: auto;
}
/**底部**/
.f-1
{
   width:100%;
   height: 836px;
}
.f-1-1
{
  width: 100%;
  height: 704px;
  background-color: #242424;
}
.f-1-2
{
  width: 100%;
  height: 132px;
  background-color: #000000;
}
.f-1-3
{
  width: 100%;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:flex-start;
}
.f-1-4
{
  margin-right: 163px;
}
.f-1-4.on
{
  margin-right: 0px;
}
.f-1-5
{
  position: relative;
  padding-right: 18px;
}
.f-1-5 a
{
  text-decoration: none;
  color: #FFFFFF;
  font-size: 28px;
  line-height: 28px;
}
.f-1-5 a:hover
{
  text-decoration: none;
  color: #38bab8;
  font-size: 28px;
  line-height: 28px;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
}
.f-1-6
{
  position: absolute;
  left: 68px;
  top:10px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color:#38bab8;
}
.f-1-7
{
  margin-top: 25px;
}
.f-1-8
{
  margin-top: 15px;
  text-align: left;
  font-family: "OPPOSans-M"; 
  font-size:16px; 
  color: #FFFFFF;
}
.f-1-8 a
{
  text-decoration: none;
  color: #FFFFFF;
}
.f-1-8 a:hover
{
  text-decoration: none;
  color: #38bab8;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
}
.f-1-9
{
  width: 160px;
  text-align: center;
  margin-top: 20px;
}
.f-1-10
{
  width: 100%;
  margin-top: 12px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
display: -moz-box; /* Firefox 17- */  
display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
display: -moz-flex; /* Firefox 18+ */  
display: -ms-flexbox; /* IE 10 */  
display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:flex-start;
}
.f-1-11
{
  position: relative;
  width: 44px;
  height: 44px;
  background-color: rgb(255,255,255,0.1);
  border-radius: 22px;
  margin-right: 12px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
display: -moz-box; /* Firefox 17- */  
display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
display: -moz-flex; /* Firefox 18+ */  
display: -ms-flexbox; /* IE 10 */  
display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:column;
  flex-wrap:nowrap;
  justify-content:center;
  align-items:center;
}
.f-1-11:hover
{
  background-color: rgb(255,255,255,1);
}
.f-1-12
{
  display: none;
  position: absolute;
  top:-60px;
  left:-400%;
}
.f-1-12 img
{
  border-radius: 8px;
}
.f-1-11:hover .f-1-12
{
  display: inline;
}
.f-1-13
{
  margin-top: 8px;
}
.f-1-14
{
  margin-top:20px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
display: -moz-box; /* Firefox 17- */  
display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
display: -moz-flex; /* Firefox 18+ */  
display: -ms-flexbox; /* IE 10 */  
display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:flex-start;
}
.f-1-15
{
  margin-right: 20px;
  /**font-family: "OPPOSans-M"; **/
  font-size:16px; 
  color: #FFFFFF;
}
.f-1-15 a
{
  text-decoration: none;
  color: #FFFFFF;
}
.f-1-15 a:hover
{
  text-decoration: none;
  font-family: "OPPOSans-B";
  /**font-weight: bold;**/
  color: #38bab8;
}
.f-1-16
{
  font-size: 16px;
  color: #FFFFFF;
}
.f-1-16 a
{
  text-decoration: none;
  color: #FFFFFF;
}
.f-1-16 a:hover
{
  text-decoration: none;
  color: #4C84EC;
}
.f-1-16 span
{
  padding:0px 20px;
  color: #979797;
}
.f-1-17
{
  margin-top: 20px;
  font-size: 16px;
  color: #9E9E9E;
}
.f-1-17 a
{
  text-decoration: none;
  color: #9E9E9E;
}
.f-1-17 a:hover
{
  text-decoration: none;
  color: #9E9E9E;
}
.f-1-17 span
{
  padding:0px 20px;
  color: #979797;
}
.f-1-18
{
  position: absolute;
  z-index: -1;
  top:70px;
  right:-10px;
  width: 20px;
  height: 20px;
  background-color: #ffffff;
  transform:rotate(45deg);
}
/**其他**/
.q-1-1
{
   color: #212121;
}
.q-1-2
{
  margin-top: 12px;
  font-family: "OPPOSans-B"; 
  font-size:40px; 
  line-height: 40px;
  /**font-weight: bold;**/
  color: #E0E0E0;
}

.q-1-3
{
   color: #FFFFFF;
}
.q-1-4
{
  margin-top: 12px;
  font-family: "OPPOSans-B"; 
  font-size:40px; 
  line-height: 40px;
  /**font-weight: bold;**/
  color: rgba(255, 255, 255,0.5);
}
.q-2-1
{
  width:180px;
  height: 60px;
  background-color: #38bab8;
  border-radius: 30px;
  line-height: 60px;
  text-align: center;
  font-family: "OPPOSans-B"; 
  font-size:20px; 
  /**font-weight: bold;**/
  color: #FFFFFF;
  cursor: pointer;
}
.q-2-1 i
{
  padding-left: 8px;
}
.q-2-1:hover
{
  background-color:#38bab8;
}
.q-2-2
{
  width:180px;
  height: 60px;
  border-radius: 30px;
  line-height: 60px;
  text-align: center;
  font-family: "OPPOSans-B"; 
  font-size:18px; 
  /**font-weight: bold;**/
  color: #424242;
  cursor: pointer;
  border:1px solid #424242;
}
.q-2-2 i
{
  padding-left: 8px;
}
.q-2-2:hover
{
  color: #FFFFFF;
  background-color:#424242;
}
.q-2-3
{
  width:240px;
  height: 80px;
  border-radius:40px;
  line-height: 80px;
  text-align: center;
  font-family: "OPPOSans-B"; 
  font-size:24px; 
  /**font-weight: bold;**/
  color: #FFFFFF;
  cursor: pointer;
  border:2px solid #FFFFFF;
}
.q-2-3:hover
{
  color: #BDBDBD;
  background-color:#FFFFFF;
}
.q-2-4
{
  height: 80px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
display: -moz-box; /* Firefox 17- */  
display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
display: -moz-flex; /* Firefox 18+ */  
display: -ms-flexbox; /* IE 10 */  
display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:flex-start;
}
.q-2-5
{
  width: 80px;
  height: 80px;
  background-color: #38bab8;
  color: #FFFFFF;
  cursor: pointer;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:column;
  flex-wrap:nowrap;
  justify-content:center;
  align-items:center;
}
.q-2-5:hover
{
  background-color: #1863DF;
}
.q-2-5 i
{
  font-size:32px;
}
.q-2-5a
{
  width: 80px;
  height: 80px;
  background-color: #38bab8;
  color: #FFFFFF;
  cursor: pointer;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:column;
  flex-wrap:nowrap;
  justify-content:center;
  align-items:center;
}
.q-2-5a:hover
{
  background-color: #1863DF;
}
.q-2-5a i
{
  font-size:32px;
}
.q-2-5b
{
  width: 80px;
  height: 80px;
  background-color: #38bab8;
  color: #FFFFFF;
  cursor: pointer;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:column;
  flex-wrap:nowrap;
  justify-content:center;
  align-items:center;
}
.q-2-5b:hover
{
  background-color: #1863DF;
}
.q-2-5b i
{
  font-size:32px;
}
.q-2-6
{
  width: 160px;
  height: 52px;
  line-height: 52px;
  text-align: center;
  background-color: #38bab8;
  border-radius: 0px 100px 100px 0px;
  font-family: "OPPOSans-M"; 
  /**font-weight: bold;**/
  color: #FFFFFF;
  cursor: pointer;
  font-size:24px; 
}
.q-2-6 i
{
  font-size:24px; 
  padding-right: 11px;
}
.q-2-6:hover
{
  background-color: #1863DF;
}
.q-2-7
{
  width: 28px;
  height: 28px;
  background-color: #38bab8;
  border-radius:14px;
  color: #ffffff;
  line-height: 28px;
  text-align: center;
  font-size: 10px;
  cursor: pointer;
}
.q-2-7:hover
{
  background-color: #1863DF;
}
.q-2-7 i
{
  font-size: 10px;
}
.q-2-8
{
  position: relative;
  width:100%;
  height: 54px;
}
.q-2-9
{
  width:100%;
  height: 54px;
  background: #FFFFFF;
  border-radius: 40px;
  border: 2px solid #38bab8;
  font-size: 24px;
  color: #424242;
  padding-left: 28px;
}
.q-2-10
{
  position: absolute;
  right: 0px;
  top:0px;
}
.q-2-11
{
  position: absolute;
  right: 180px;
  top:15px;
}
.q-2-12
{
  height: 32px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:flex-start;
}
.q-2-14
{
  width: 100%;
  height: 232px;
  padding:0px 60px;
  padding-top:112px;
  background-color: #FFFFFF;
}
.q-2-15
{
  height: 32px;
  margin-top: 28px;
}
.q-2-15 span
{
  font-family: "OPPOSans-M"; 
  line-height: 32px;
  /**font-weight: bold;**/
  font-size: 20px;
  color: #424242;
}
.q-2-15 a
{
  text-decoration: none;
  line-height: 32px;
  padding:8px 12px;
  color: #424242;
  font-size: 16px;
}
.q-2-15 a:hover
{
  text-decoration: none;
  line-height: 32px;
  padding:8px 12px;
  color: #38bab8;
  font-size: 16px;
}
.q-2-15 a.on
{
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
  color: #38bab8;
  background-color: #E5EFFF;
}
.q-2-15 a.jinzhi
{
  
  border: 1px dashed #BDBDBD;
  color: #BDBDBD;
  background-color: #FAFAFA;
}
.q-2-17
{
  width:100%;
  padding:0px 8px;
  height: 68px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:space-around;
  background-color: rgb(255, 255, 255,0.2);
  border-radius: 34px;
}
.q-2-18
{
  width:100%;
  height: 52px;
  margin-top: 8px;
  color: #FFFFFF;
  font-size: 24px;
  line-height: 52px;
  text-align: center;
  cursor: pointer;
}
.q-2-18.on
{
  color: #38bab8;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
  background: #FFFFFF;
  box-shadow: 0px 8px 20px 0px rgba(0, 71, 191, 0.4);
  border-radius: 47px;
}
.q-2-19
{
  width: 101px;
  height: 32px;
  margin-right: 8px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  background-color:#FFE3E8;
  color:#FF1744;
}
.q-2-19 a
{
  text-decoration: none;
  color:#FF1744;
}
.q-2-19 a:hover
{
  text-decoration: none;
  color:#FFFFFF;
}
.q-2-19:hover
{
  width: 101px;
  height: 32px;
  margin-right: 8px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  background-color:#FF1744;
  color:#FFFFFF;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
}
.q-2-19:hover a
{
  color:#FFFFFF;
}
.q-2-20
{
  width: 101px;
  height: 32px;
  margin-right: 8px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  background-color: #FFF3CC;
  color: #FFC400;
}
.q-2-20 a
{
  text-decoration: none;
  color:#FFC400;
}
.q-2-20 a:hover
{
  text-decoration: none;
  color:#FFFFFF;
}
.q-2-20:hover
{
  width: 101px;
  height: 32px;
  margin-right: 8px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  background-color:#FFC400;
  color:#FFFFFF;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
}
.q-2-20:hover a
{
  color:#FFFFFF;
}
.q-2-21
{
  width: 101px;
  height: 32px;
  margin-right: 8px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  background-color: rgb(41,121,255,0.12);
  color:#38bab8;
}
.q-2-21 a
{
  text-decoration: none;
  color:#38bab8;
}
.q-2-21 a:hover
{
  text-decoration: none;
  color:#FFFFFF;
}
.q-2-21:hover
{
  width: 101px;
  height: 32px;
  margin-right: 8px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  background-color:#38bab8;
  color:#FFFFFF;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
}
.q-2-21:hover a
{
  color:#FFFFFF;
}
.q-2-22
{
  width: 101px;
  height: 32px;
  margin-right: 8px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  background-color:#FAFAFA;
  color:#757575;
}
.q-2-22 a
{
  text-decoration: none;
  color:#757575;
}
.q-2-22 a:hover
{
  text-decoration: none;
  color:#757575;
}
.q-2-22:hover
{
  width: 101px;
  height: 32px;
  margin-right: 8px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  cursor: pointer;
  background-color:#EEEEEE;
  color:#757575;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
}
.q-2-22:hover a
{
  color:#FFFFFF;
}
.q-2-23
{
  width: 100%;
  height: 190px;
  padding:68px 80px;
  background: #FFFFFF;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:space-between;
  align-items:center;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.04);
  margin-bottom: 10px;
}
.q-2-24
{
   padding:0px 22px 0px 22px;
   font-size: 18px;
   color: #666666;
   text-indent:30px;
   width: 100%;
   text-align: left;
   line-height: 32px;
}
.q-2-25
{
  width: 100%;
  height: 200px;
  padding:68px 80px;
  background: #EEEEEE;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:space-between;
  align-items:center;
}
.q-3-1
{
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:space-between;
}
.q-3-2
{
  position: relative;
  width: 100%;
  height: 52px;
  line-height: 52px;
  padding-left: 28px;
  box-shadow: 0px 0px 12px 0px rgba(41, 121, 255, 0.4);
  border-radius: 26px 0px 0px 26px;
  border: 2px solid #38bab8;
  font-size: 24px;
  color: #9E9E9E;
  background-color: #FFFFFF;
  z-index:3;
  transition-property: all;
  transition-duration: 0.2s;
}
.q-3-3
{
  width: 160px;
  height: 52px;
  background: #38bab8;
  border-radius: 0px 100px 100px 0px;
}
.q-3-4
{
  position: absolute;
  top:0px;
  left:0px;
  width: 100%;
  height:48px;
  line-height: 48px;
  padding-left: 28px;
  border: 0px;
  border-radius: 26px 0px 0px 26px;
  font-size: 24px;
  color: #424242;
  background-color:transparent;
}
.q-3-4:hover
{
  outline: none;
}
.q-3-4:focus
{
  outline: none;
}
.q-3-4:active
{
  outline: none;
}
.q-3-5
{
  display: none;
  position: absolute;
  top:52px;
  left:0px;
  width: 100%;
  padding:6px 28px;
  height: 300px;
  overflow-x:hidden;
  overflow-y:auto;
}
.q-3-6
{
  width: 100%;
  height: 52px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:space-between;
  align-items:center;
  font-size: 20px;
  color: #757575;
  cursor: pointer;
}
.q-3-7 i
{
  color: #FFFFFF;
}
.q-3-6.on
{
  color: #38bab8;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
}
.q-3-6.on .q-3-7 i
{
  color: #38bab8;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
}
.q-3-8
{
  display: none;
  position: absolute;
  top:52px;
  left:-10px;
  width: 100%;
  padding:6px;
  height: auto;
  overflow-x:hidden;
  overflow-y:auto;
  background-color: #FFFFFF;
}
.q-3-9
{
  margin-top: 10px;
  font-size: 16px;
  color: #424242;
  line-height: 16px;
}
.q-3-9 span
{
  color: #000000;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
}
.q-3-10
{
  margin-top: 30px;
  font-size: 20px;
  font-family: 'OPPOSans-M';
  font-weight: normal;
  color: #424242;
  line-height: 20px;
}
.q-3-11
{
  margin-top: 6px;
}
.q-3-12
{
  
  position: absolute;
  top:0px;
  left:0px;
  width: 100%;
  padding-left:28px;
  height:48px;
}
.q-3-13
{
  width: 100%;
  height: 48px;
  border-bottom: 1px solid #EEEEEE;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:flex-start;
  align-items:center;
}
.q-3-14
{
  width: 120px;
  margin-right: 8px;
  height: 32px;
  background:rgb(41,121,255,0.12);
  border-radius: 4px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  font-family: 'OPPOSans-B';
  /**font-weight: bold;**/
  color: #38bab8;
  cursor: pointer;
}
.q-3-14 i
{
  padding-left: 12px;
  color: #38bab8;
}
.q-3-15
{
  display: none;
  position: absolute;
  right: 10px;
  top:10px;
  cursor: pointer;
}
/**客服**/
.newkefua
{
  position: fixed;
  right: 20px;
  bottom:20px;
  z-index: 99;
}
.newkefu
{
  width: 66px;
  height: 132px;
  overflow: hidden;
  z-index: 9999;
  border-radius: 8px;
  transition-property: all;
  transition-duration: 0.5s;
}
.kefufanhui
{
   height: 198px;
}
.kefu-1
{
  width: 66px;
  height: 66px;
  padding:0px 8px;
  background-color: #FFFFFF;
  transition-property: all;
  transition-duration: 0.2s;
}

.kefunr
{
  width: 100%;
  height: 66px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:column;
  flex-wrap:nowrap;
  justify-content:center;
  align-items:center;
  cursor: pointer;
  color: #757575;
  font-size: 16px;
  border-bottom:1px solid #EEEEEE;
}
.kefunr i
{
  color: #757575;
  font-size: 24px;
}
.kefu-1:hover
{
  background-color: #38bab8;
  color: #FFFFFF;
}
.kefu-1:hover span
{
  color: #FFFFFF;
}
.kefu-1:hover i
{
  color: #FFFFFF;
}
.kefu-2
{
  display: none;
  position: absolute;
  top:71px;
  right: 90px;
  width: 204px;
  height: 56px;
  background: #FFFFFF;
  border-radius: 8px;
  font-family: 'OPPOSans-B';
  font-size: 24px;
  color: #424242;
  line-height: 56px;
  text-align: center;
  transition-property: all;
  transition-duration: 0.2s;
}
.kefu-2a
{
  position: absolute;
  z-index: -1;
  top:22px;
  right:-5px;
  width: 10px;
  height: 10px;
  background-color: #ffffff;
  transform:rotate(45deg);
}
.kefu-2s
{
  display: block;
  width: 204px;
}
.kefu-2as
{
  display: block;
}
#nav-1 .nav {
  width:100%;
  padding:0px 8px;
  height: 68px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:space-around;
  background-color: rgb(255, 255, 255,0.2);
  border-radius: 34px;
}
#nav-1 .nav li {
  width:100%;
  height: 52px;
  color: #FFFFFF;
  font-size: 24px;
  line-height: 52px;
  text-align: center;
  cursor: pointer;
}
#nav-1 .nav li a {
  position: relative;
  color: #FFFFFF;
  font-size: 24px;
  display: inline-block;
  text-decoration: none;
  z-index: 3;
}
#nav-1 .nav li a.active {
  color: #38bab8;
}
#nav-1 .slide1{
  position: absolute;
  width:100%;
  height: 52px;
  margin-top: 8px;
  color: #FFFFFF;
  font-size: 24px;
  line-height: 52px;
  text-align: center;
  cursor: pointer;
  color: #38bab8;
  font-family: "OPPOSans-B"; 
  /**font-weight: bold;**/
  box-shadow: 0px 8px 20px 0px rgba(0, 71, 191, 0.4);
  border-radius: 47px;
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1.05);
}
#nav-1 .nav .slide1 {
  background: #FFFFFF;
  z-index: 2;
}

/**头部**/
.h-1-1
{
  position: relative;
  width: 100%;
  font-size: 0;
}
.h-1-1 video
{
  width:100%;
  object-fit: fill
}
.h-1-1 img
{
  width: 100%;
}
.h-1-2
{
  position: absolute;
  top:380px;
  left:0px;
  width: 100%;
  text-align: center;
  font-family: "OPPOSans-B"; 
  font-size:100px; 
  line-height: 100px;
  /**font-weight: bold;**/
}

.h-1-3
{
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:center;
  position: absolute;
  top:520px;
  left:0px;
  width: 100%;
}
.h-1-4
{
  width: 100%;
  height: 736px;
  background-color: #38bab8;
}
.h-1-5
{
  width: 100%;
  margin-top: 240px;
  font-size: 80px;
  line-height: 80px;
  font-family: 'OPPOSans-B';
  /**font-weight: bold;**/
  color: #FFFFFF;
  text-align: left;
}
.h-1-6
{
  width: 100%;
  margin-top: 40px;
  font-size: 20px;
  line-height: 28px;
  color: #FFFFFF;
  text-align: left;
}
.h-1-7
{
  position: relative;
  width: 100%;
  height: 1080px;
}
.h-1-8
{
  position: absolute;
  left:0px;
  top: 140px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:flex-start;
}
.h-1-8 img
{
  cursor: pointer;
  margin-right: 8px;
  width: auto;
}

.h-2-1
{
  position: fixed;
  top:0px;
  left:0px;
  width: 100%;
  height: 220px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 100%);
  z-index: 9998;
  transition:top 0.5s;
}
.h-2-1a
{
  height: 120px;
}
.header-hide
{
  top:-120px;
}
.h-2-2
{
  position:relative;
  top:0px;
  left:0px;
  width:100%;
  height: 120px;
  background-color: rgb(33,33,33,0);
  transition-property: all;
  transition-duration: 0.2s;
  z-index: 9999;
}
.h-2-2:hover
{
  background-color: rgb(33,33,33,0.9);
}
.h-2-3
{
  position: relative;
  width:100%;
  height: 120px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:space-between;
  align-items:center;
}
.h-2-4
{
  width: 100%;
  padding:0px;
  height: 120px;
}
.h-2-5
{
  height: 120px;
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */  
  display: -moz-box; /* Firefox 17- */  
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */  
  display: -moz-flex; /* Firefox 18+ */  
  display: -ms-flexbox; /* IE 10 */  
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:flex-start;
  align-items:center;
}
.h-2-6
{
  width:120px;
  line-height: 120px;
  font-size: 24px;
  font-weight: normal;
  color: #FFFFFF;
  text-align: center;
  transition-property: all;
  transition-duration: 0.5s;
}
.h-2-6.on
{
  font-family: "OPPOSans-H";
  /**font-weight: bold;**/
}
.h-2-6.on a
{
  font-family: "OPPOSans-H";
  /**font-weight: bold;**/
}
.h-2-6 a
{
  text-decoration: none;
  color: #FFFFFF;
   transition-property: all;
  transition-duration: 0.5s;
}
.h-2-6 a:hover
{
  color: #FFFFFF;
  font-family: "OPPOSans-H";
  /**font-weight: bold;**/
}
.h-2-6:hover .h-1-9
{
  display: inline;
}
.h-2-7
{
  width:200px;
  text-align: center;
  font-size: 24px;
  color: #FFFFFF;
  font-family: "OPPOSans-H";
  /**font-weight: bold;**/
}
.h-1-9
{
  display: none;
  position: absolute;
  top:120px;
  left:0px;
  width:100%;
  height: 560px;
  background-color: rgb(33,33,33,0.9);
  z-index: 9999;
}
.h-1-10
{
  width:100%;
  padding:0px 120px;
  display: none;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:flex-start;
   transition-property: all;
   transition-duration: 0.5s;
}
.h-1-11
{
  width:160px;
  height: 200px;
  margin:40px 40px 0px 40px;
}
.h-1-12
{
  width:160px;
  height: 160px;
}
.h-1-12 img
{
  cursor: pointer;
  transition-property: all;
   transition-duration: 0.5s;
}
.h-1-13
{
  width:100%;
  text-align: center;
  margin-top: 20px;
  line-height: 20px;
  font-size: 20px;
  font-weight: normal;
  color: #9E9E9E;
}
.h-1-13 a
{
  text-decoration: none;
  color: #9E9E9E;
  transition-property: all;
  transition-duration: 0.2s;
}
.h-1-13 a:hover
{
  font-family: "OPPOSans-B";
  /**font-weight: bold;**/
  text-decoration: none;
  color: #FFFFFF;
}
.h-1-11:hover .h-1-12 img
{
  transform:scale(1.1,1.1);
}
.h-1-11:hover .h-1-13 a
{
  font-family: "OPPOSans-B";
  /**font-weight: bold;**/
  text-decoration: none;
  color: #FFFFFF;
}
.h-1-14
{
  width:100%;
  padding:0px 200px;
  display: none;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:flex-start;
}
.imgpic
{
   overflow: hidden;
}
.imgpic img
{
   cursor: pointer;
   transition-property: all;
   transition-duration: 0.5s;
}
.imgpic img:hover
{
   transform:scale(1.1,1.1);
}

.n-1-6:hover .n-1-8 img,.n-1-9:hover .n-1-8 img,.n-1-10:hover .n-1-8 img
{
   transform:scale(1,1);
}
.prevStop
{
  cursor:default;
  background-color: #E5EFFF;
}
.nextStop
{
  cursor:default;
  background-color: #E5EFFF;
}

#modal-containers {
  position: fixed;
  display: table;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  transform: scale(0);
  z-index: 99999;
}
#modal-containers.one {
  transform: scaleY(0.01) scaleX(0);
  animation: unfoldIna 1s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-containers.one .modal-background .modals {
  transform: scale(0);
  animation: zoomIna 0.5s 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-containers.one.out {
  transform: scale(1);
  animation: unfoldOuta 1s 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-containers.one.out .modal-background .modals {
  animation: zoomOuta 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

#modal-containers .modal-background {
  display: table-cell;
  background: rgba(0, 0, 0, 0.6);
  text-align: center;
  vertical-align: middle;
}


@keyframes unfoldIna {
  0% {
    transform: scaleY(0.005) scaleX(0);
  }
  50% {
    transform: scaleY(0.005) scaleX(1);
  }
  100% {
    transform: scaleY(1) scaleX(1);
  }
}
@keyframes unfoldOuta {
  0% {
    transform: scaleY(1) scaleX(1);
  }
  50% {
    transform: scaleY(0.005) scaleX(1);
  }
  100% {
    transform: scaleY(0.005) scaleX(0);
  }
}
@keyframes zoomIna {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes zoomOuta{
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}

#x-3a
{
  width: 100%;
  height: 835px;
}
.x-3-1a
{
  position: relative;
  width: 100%;
  height: 100px;
  background: #1890FF;
}
.x-3-22aa
{
  width: 100%;
  height: 635px;
  padding: 60px 30px 80px 30px;
  background: #FFFFFF;
}
.x-3-22a
{
  width: 100%;
  height: 495px;
  padding: 0px 50px 0px 50px;
  background: #FFFFFF;
  overflow-x:hidden;
  overflow-y:auto;
}
.x-3-22a::-webkit-scrollbar 
{
  width: 4px;    
}
.x-3-22a::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
  background: rgba(0,0,0,0.2);
}
.x-3-22a::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
  border-radius: 0;
  background: rgba(0,0,0,0.1);
}
.x-3-3a
{
  position: absolute;
  top:30px;
  right: 30px;
}
.x-3-3a i
{
  cursor: pointer;
  color: #FFFFFF;
  font-size: 16px;
}
.x-3-4a
{
  position: absolute;
  top:30px;
  left:80px;
  font-size: 40px;
  font-family: 'OPPOSans-H';
  /**font-weight: bold;**/
  color: #FFFFFF;
  line-height: 40px;
}
.x-3-5a
{
  position: absolute;
  top:112px;
  left:80px;
  width: 64px;
  height: 36px;
  line-height: 32px;
  border-radius: 4px;
  border: 2px solid #FFFFFF;
  text-align: center;
  font-size: 20px;
  font-family: 'OPPOSans-M';
  color: #FFFFFF;
}
.x-3-22a p
{
  font-size: 20px;
  color: #424242;
  line-height: 36px;
  text-align: left;
}

.newkefub
{
  position: fixed;
  right: 20px;
  bottom:150px;
  z-index: 99;
}
.kefua
{
  width: 222px;
  background: #FFFFFF;
  box-shadow: -1px -1px 3px 0px rgba(0,0,0,0.3);
  border-radius: 18px;
  border: 1px solid #38bab8;
}
.kefua_1
{
  width:100%;
  padding-top: 22px;
  text-align: center;
  color: #38bab8;
  font-size: 39px;
  font-family: 'OPPOSans-B';
}
.kefua_2
{
  width:100%;
  margin-top: 20px;
  text-align: center;
}
.kefua_3
{
  width:100%;
  padding:0px 10%;
  margin-top: 16px;
  line-height: 18px;
  text-align: center;
  color: #38bab8;
  font-size: 13px;
  font-family: 'OPPOSans-B';
}
.kefua_4
{
  position: relative;
  width:82px;
  height: 27px;
  border-radius: 14px;
  background-color: #38bab8;
  margin:15px auto;
  color: #FFFFFF;
  font-size: 13px;
  font-family: 'OPPOSans-B';
  line-height: 27px;
  text-align: center;
  cursor: pointer;
}
.kefua_4:hover
{
  position: relative;
  width:82px;
  height: 27px;
  border-radius: 14px;
  background-color: #FFC400;
  margin:15px auto;
  color: #FFFFFF;
  font-size: 13px;
  font-family: 'OPPOSans-B';
  line-height: 27px;
  text-align: center;
  cursor: pointer;
}
.kefua_4a
{
  position: absolute;
  top:-7px;
  left:90px;
}
.kefua_4a img
{
  width:35px;
}
.kefua_5
{
  width:100%;
  height: 2px;
  margin-top: 16px;
  background-color: #38bab8;
}
.kefua_5a
{
  width:100%;
  height: 2px;
  background-color: #38bab8;
}
.kefua_6
{
  width:100%;
  margin-top: 25px;
  text-align: center;
  color: #38bab8;
  font-size: 12px;
}
.kefua_7
{
  width:100%;
  margin-top: 6px;
  padding-bottom: 22px;
  text-align: center;
  color: #38bab8;
  font-size: 20px;
  font-family: 'OPPOSans-B';
}
.newkefubz
{
  position: fixed;
  right: 20px;
  bottom:20px;
  z-index: 99;
}
.kefuaz
{
  width: 183px;
  background: #FFFFFF;
  box-shadow: -1px -1px 3px 0px rgba(0, 0, 0, 0.3);
  border-radius: 18px;
  border: 1px solid #38bab8;
}
.kefua_1z
{
  width:100%;
  padding-top: 23px;
  text-align: center;
  color: #38bab8;
  font-size: 39px;
  font-family: 'OPPOSans-B';
}
.kefua_2z
{
  width:100%;
  margin-top: 20px;
  text-align: center;
}
.kefua_3z
{
  width:100%;
  padding:0px 10%;
  margin-top: 10px;
  line-height: 18px;
  text-align: center;
  color: #38bab8;
  font-size: 13px;
  font-family: 'OPPOSans-B';
}
.kefua_5z
{
  width:100%;
  height: 2px;
  margin-top: 10px;
  background-color: #38bab8;
}

.kefua_6z
{
  width:100%;
  margin-top: 15px;
  text-align: center;
  color: #38bab8;
  font-size: 12px;
}
.kefua_7z
{
  width:100%;
  margin-top: 6px;
  padding-bottom: 22px;
  text-align: center;
  color: #38bab8;
  font-size: 20px;
  font-family: 'OPPOSans-B';
}
.piaofu
{
  width: 100%;
  position: fixed;
  left: 0px;
  bottom:0px;
  z-index: 99;
}
.piaofu_1
{
  width: 100%;
  height: 108px;
  background: rgba(255, 255, 255, 0.5);
}
.piaofu_2
{
   position: relative;
   width:100%;
   text-align: center;
   padding-top: 11px;
   font-size: 15px;
   font-weight: 500;
   color: #4A4A4A;
}
.piaofu_3
{
   position: absolute;
   top:11px;
   right: 3px;
   cursor: pointer;
}
.piaofu_4
{
  margin-top: 10px;
  display: -webkit-flex;
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  justify-content:center;
}
.piaofu_5
{
  position: relative;
  width: 174px;
  height: 35px;
  background: #4A4A4A;
  margin-right: 26px;
  padding-left: 20px;
  line-height: 35px;
  font-size: 15px;
  font-weight: 400;
  color: #FFFFFF;
}
.piaofu_7
{
  width: 100%;
  height: 35px;
  background: #4A4A4A;
  border:0px;
  color: #FFFFFF;
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #FFFFFF;
  font-size: 15px;
}

input:-moz-placeholder, textarea:-moz-placeholder {
  color: #FFFFFF;
  font-size: 15px;
}

input::-moz-placeholder, textarea::-moz-placeholder {
  color: #FFFFFF;
  font-size: 15px;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: #FFFFFF;
  font-size: 15px;
}
.piaofu_6
{
  width: 147px;
  height: 39px;
  background: #4A90E2;
  border-radius: 20px;
  font-size: 15px;
  font-weight: 500;
  color: #FFFFFF;
  line-height: 39px;
  cursor: pointer;
  text-align: center;
}
.piaofu_8
{
  position: absolute;
  top:0px;
  left: 3px;
}
@media (max-width: 1500px) 
{
.kefua
{
width: 165px;
background: #FFFFFF;
box-shadow: -1px -1px 2px 0px rgba(0,0,0,0.3);
border-radius: 11px;
border: 0px solid #38bab8;
}
.kefua_1
{
  width:100%;
  padding-top: 17px;
  text-align: center;
  color: #38bab8;
  font-size: 29px;
  font-family: 'OPPOSans-B';
}
.kefua_2
{
  width:100%;
  margin-top:11px;
  text-align: center;
}
.kefua_2 img
{
  height: 80px;
}

.kefua_3
{
  width:100%;
  padding:0px 10%;
  margin-top: 12px;
  line-height: 14px;
  text-align: center;
  color: #38bab8;
  font-size: 15px;
  font-family: 'OPPOSans-B';
}
.kefua_4
{
  position: relative;
  width:62px;
  height: 20px;
  border-radius: 10px;
  background-color: #38bab8;
  margin:11px auto;
  color: #FFFFFF;
  font-size: 10px;
  font-family: 'OPPOSans-B';
  line-height: 20px;
  text-align: center;
  cursor: pointer;
}
.kefua_4:hover
{
  position: relative;
  width:62px;
  height: 20px;
  border-radius: 10px;
  background-color: #FFC400;
  margin:11px auto;
  color: #FFFFFF;
  font-size: 10px;
  font-family: 'OPPOSans-B';
  line-height: 20px;
  text-align: center;
  cursor: pointer;
}
.kefua_4a
{
  position: absolute;
  top:-1px;
  left:70px;
}
.kefua_4a img
{
  width:20px;
}
.kefua_5
{
  width:0%;
  height: 1px;
  margin-top: 12px;
  background-color: #38bab8;
}
.kefua_5a
{
  width:0%;
  height: 1px;
  background-color: #38bab8;
}
.kefua_6
{
  width:100%;
  margin-top: 19px;
  text-align: center;
  color: #38bab8;
  font-size: 9px;
}
.kefua_7
{
  width:100%;
  margin-top: 6px;
  padding-bottom: 17px;
  text-align: center;
  color: #38bab8;
  font-size: 15px;
  font-family: 'OPPOSans-B';
}
}