/*--adam.ai@tp-link.com--*/
/*------2016/12/29-------*/
.overview-content {
  font-weight: 300;
  margin: 0 auto;
  max-width: 1920px;
  overflow-x: hidden;
}

.overview-content .regular { font-weight: 400; }

.overview-content .semibold { font-weight: 700; }

.overview-content .bold { font-weight: 700; }

.overview-content .w1200 {
  margin: 0 auto;
  position: relative;
  width: 1200px;
}

.overview-content .nowrap { white-space: nowrap; }

.overview-content .m-show { display: none; }

.overview-content .a {
  background: url(a.jpg) 50% 0 no-repeat;
  height: 960px;
}

.overview-content .a .text {
  padding-left: 677px;
  padding-top: 465px;
}

.overview-content .a .text h2 {
  color: #fff;
  font-size: 50px;
  line-height: 1.2;
}

.overview-content .a .text h3 {
  color: #fff;
  font-size: 32px;
  line-height: 1.2;
  padding-top: 32px;
}

.overview-content .a .text h4 {
  color: #fff;
  font-size: 32px;
  line-height: 1.2;
  padding-top: 13px;
}

.overview-content .b {
  background: url(b.jpg) 50% 0 no-repeat;
  height: 960px;
}

.overview-content .b .text {
  color: #434343;
  padding-top: 325px;
  padding-left: 40px;
  width: 420px;
}

.overview-content .b .text h2 {
  color: inherit;
  font-size: 50px;
  line-height: 1.2;
}

.overview-content .b .text p {
  color: inherit;
  font-size: 20px;
  line-height: 1.5;
  padding-top: 40px;
}

.overview-content .c {
  background: url(c.jpg) 50% 0 no-repeat;
  height: 789px;
}

.overview-content .c .text {
  color: #fff;
  padding-left: 563px;
  padding-top: 145px;
}

.overview-content .c .text h2 {
  color: inherit;
  font-size: 50px;
  line-height: 1.2;
}

.overview-content .c .text p {
  color: inherit;
  font-size: 20px;
  line-height: 1.5;
  padding-top: 40px;
  width: 570px;
}

.overview-content .c .chart p {
  font-size: 0;
  padding-left: 563px;
  padding-top: 35px;
}

.overview-content .c .chart span {
  color: #fff;
  display: inline-block;
  line-height: 26px;
}

.overview-content .c .chart span:nth-child(1) {
  font-size: 20px;
  width: 100px;
}

.overview-content .c .chart span:nth-child(2) {
  background: #96b9e5;
  font-size: 17px;
  text-indent: 23px;
  width: 270px;
}

.overview-content .c .chart p+p span:nth-child(2) {
  background: #75c3ca;
  width: 390px;
}

.overview-content .c .chart span:nth-child(3) {
  font-size: 18px;
  padding-left: 18px;
}

.overview-content .c .icons {
  background: url(c-icons.png) no-repeat;
  height: 37px;
  margin-left: 675px;
  margin-top: 30px;
  width: 366px;
}

.overview-content .d { background: #fbfbfb; }

.overview-content .d .text {
  margin: 0 auto;
  padding: 75px 0 80px;
  text-align: center;
  width: 1020px;
}

.overview-content .d .text h2 {
  font-size: 50px;
  line-height: 1.2;
}

.overview-content .d .text p {
  font-size: 20px;
  line-height: 1.5;
  padding-top: 40px;
}

.overview-content .e {
  font-size: 0;
  text-align: center;
}

.overview-content .e .title {
  padding: 70px 0 50px;
  text-align: center;
}

.overview-content .e .title h3 {
  display: inline-block;
  font-size: 40px;
  line-height: 1;
  position: relative;
}

.overview-content .e .title h3:before {
  background: #959595;
  content: "";
  display: block;
  height: 1px;
  left: -140px;
  position: absolute;
  top: 20px;
  width: 110px;
}

.overview-content .e .title h3:after {
  background: #959595;
  content: "";
  display: block;
  height: 1px;
  position: absolute;
  right: -140px;
  top: 20px;
  width: 110px;
}

.overview-content .e .sec {
  background-size: 100% 100%;
  background-position: center center;
  background-repeat: no-repeat;
  display: inline-block;
  height: 0;
  padding-bottom: 30%;
  position: relative;
  width: 42%;
}

.overview-content .e .sec+.sec { margin-left: 1.2%; }

.overview-content .e .sec .bg,
.overview-content .e .sec .wifi {
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center center;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
}

.overview-content .e .sec .text {
  background: rgba(0,0,0,0.6);
  bottom: 0;
  padding: 20px 12%;
  position: absolute;
}

.overview-content .e .sec .text h4 {
  color: #fff;
  font-size: 24px;
  line-height: 1.2;
}

.overview-content .e .sec .text p {
  color: #fff;
  font-size: 18px;
  line-height: 1.5;
  padding-top: 10px;
}

.overview-content .e .e1 .bg { background-image: url(e1-bg.jpg); }

.overview-content .e .e1 .wifi { background-image: url(e1-wifi.png); }

.overview-content .e .e2 .bg { background-image: url(e2-bg.jpg); }

.overview-content .e .e2 .wifi { background-image: url(e2-wifi.png); }

.overview-content .e .sec .cover {
  background: rgba(0,0,0,0.45);
  bottom: 0;
  cursor: default;
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  transition: opacity 0.3s linear;
  top: 0;
}

.overview-content .e .sec:hover .bg { filter:blur(3px); }

.overview-content .e .sec:hover .wifi { opacity: 0; }

.overview-content .e .sec:hover .cover { opacity: 1; }

.overview-content .e .sec .cover .icons {
  background-position: 50% 100%;
  background-repeat: no-repeat;
  bottom: 52%;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  max-width: 100%;
}

.overview-content .e .e1 .cover .icons {
  background-image: url(e1-icons.png);
  height: 72px;
  width: 367px;
}

.overview-content .e .e2 .cover .icons {
  background-image: url(e2-icons.png);
  height: 76px;
  width: 358px;
}

.overview-content .e .sec .cover p {
  bottom: -28px;
  color: #fff;
  font-size: 14px;
  line-height: 1;
  position: absolute;
  text-align: center;
  white-space: nowrap;
  width: 100px;
}

.overview-content .e .e1 .cover .p1 { left: -28px; }

.overview-content .e .e1 .cover .p2 { left: 52px; }

.overview-content .e .e1 .cover .p3 { left: 174px; }

.overview-content .e .e1 .cover .p4 { left: 246px; }

.overview-content .e .e1 .cover .p5 { left: 302px; }

.overview-content .e .e2 .cover .p1 { left: -32px; }

.overview-content .e .e2 .cover .p2 { left: 46px; }

.overview-content .e .e2 .cover .p3 { left: 168px; }

.overview-content .e .e2 .cover .p4 { left: 240px; }

.overview-content .e .e2 .cover .p5 { left: 296px; }

.overview-content .f {
  font-size: 0;
  padding-bottom: 116px;
  text-align: center;
}

.overview-content .f .title {
  padding: 70px 0 50px;
  text-align: center;
}

.overview-content .f .title h3 {
  display: inline-block;
  font-size: 40px;
  line-height: 1;
  position: relative;
}

.overview-content .f .title h3:before {
  background: #959595;
  content: "";
  display: block;
  height: 1px;
  left: -140px;
  position: absolute;
  top: 20px;
  width: 110px;
}

.overview-content .f .title h3:after {
  background: #959595;
  content: "";
  display: block;
  height: 1px;
  position: absolute;
  right: -140px;
  top: 20px;
  width: 110px;
}

.overview-content .f .sec {
  background-size: 100% 100%;
  background-position: center center;
  background-repeat: no-repeat;
  display: inline-block;
  height: 0;
  padding-bottom: 35%;
  position: relative;
  width: 27.8%;
}

.overview-content .f .sec+.sec { margin-left: 1%; }

.overview-content .f .sec .bg,
.overview-content .f .sec .wifi {
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center center;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
}

.overview-content .f .sec .text {
  background: rgba(0,0,0,0.6);
  bottom: 0;
  padding: 20px 12%;
  position: absolute;
}

.overview-content .f .sec .text h4 {
  color: #fff;
  font-size: 24px;
  line-height: 1.2;
}

.overview-content .f .sec .text p {
  color: #fff;
  font-size: 18px;
  line-height: 1.5;
  padding-top: 10px;
}

.overview-content .f .f1 .bg { background-image: url(f1-bg.jpg); }

.overview-content .f .f1 .wifi { background-image: url(f1-wifi.png); }

.overview-content .f .f2 .bg { background-image: url(f2-bg.jpg); }

.overview-content .f .f3 .bg { background-image: url(f3-bg.jpg); }

.overview-content .f .f3 .wifi { background-image: url(f3-wifi.png); }

.overview-content .f .sec .cover {
  background: rgba(0,0,0,0.45);
  bottom: 0;
  cursor: default;
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  transition: opacity 0.3s linear;
  top: 0;
}

.overview-content .f .sec:hover .bg { filter:blur(3px); }

.overview-content .f .sec:hover .wifi { opacity: 0; }

.overview-content .f .sec:hover .cover { opacity: 1; }

.overview-content .f .sec .cover .icons {
  background-size: 100% auto;
  background-position: 50% 100%;
  background-repeat: no-repeat;
  bottom: 52%;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  max-width: 90%;
}

.overview-content .f .f1 .cover .icons {
  background-image: url(f1-icons.png);
  height: 74px;
  width: 436px;
}

.overview-content .f .f2 .cover .icons {
  background-image: url(f2-icons.png);
  height: 73px;
  width: 419px;
}

.overview-content .f .f3 .cover .icons {
  background-image: url(f3-icons.png);
  height: 72px;
  width: 436px;
}

/* 当屏幕缩小时，图标区可能比背景还大，故采用百分比 */
.overview-content .f .sec .cover p {
  bottom: -30px;
  color: #fff;
  font-size: 14px;
  line-height: 1;
  position: absolute;
  text-align: center;
  white-space: nowrap;
  width: 50%;
}

@media screen and (max-width:1600px) {

.overview-content .f .sec .cover p {
  bottom: -28px;
  font-size: 13px;
}
}

@media screen and (max-width:1440px) {

.overview-content .f .sec .cover p {
  bottom: -24px;
  font-size: 12px;
}
}

.overview-content .f .f1 .cover .p1 { left: -20%; }

.overview-content .f .f1 .cover .p2 { left: -2%; }

.overview-content .f .f1 .cover .p3 { left: 16%; }

.overview-content .f .f1 .cover .p4 { left: 42%; }

.overview-content .f .f1 .cover .p5 { left: 58.5%; }

.overview-content .f .f1 .cover .p6 { left: 71.5%; }

.overview-content .f .f2 .cover .p1 { left: -19.5%; }

.overview-content .f .f2 .cover .p2 { left: -1%; }

.overview-content .f .f2 .cover .p3 { left: 26%; }

.overview-content .f .f2 .cover .p4 { left: 60%; }

.overview-content .f .f3 .cover .p1 { left: -20%; }

.overview-content .f .f3 .cover .p2 { left: -2%; }

.overview-content .f .f3 .cover .p3 { left: 16%; }

.overview-content .f .f3 .cover .p4 { left: 42%; }

.overview-content .f .f3 .cover .p5 { left: 58.5%; }

.overview-content .f .f3 .cover .p6 { left: 71.5%; }

.overview-content .g {
  background: #3a5565;
  padding-bottom: 140px;
}

.overview-content .g .text {
  color: #fff;
  padding-top: 75px;
  text-align: center;
}

.overview-content .g .text h2 {
  color: inherit;
  font-size: 50px;
  line-height: 1.2;
}

.overview-content .g .text p {
  color: inherit;
  font-size: 20px;
  line-height: 1.5;
  padding-top: 40px;
}

.overview-content .g .img {
  background: url(g.png) 50% 0 no-repeat;
  height: 298px;
  margin-top: 65px;
  position: relative;
}

.overview-content .g .img p {
  color: #fff;
  font-size: 19px;
  left: 540px;
  line-height: 1;
  position: absolute;
  text-align: center;
  width: 200px;
}

.overview-content .g .img .p1 { top: 100px; }

.overview-content .g .img .p2 { top: 293px; }

@media screen and (max-width:736px){ 
  html { font-size:10.35px; }
  .overview-content .w1200 { width:auto; }
  .overview-content section h2 { font-weight: 400; }
  .overview-content .a { background:url(m/a.jpg) 50% 0 / 100% auto no-repeat; height:0; padding-bottom:133%; }
  .overview-content .a .text { padding:0; }
  .overview-content .a .text h2 { font-size:6.25vw; line-height:1.2; margin:0 auto; padding-top:87%; text-align:center; width:60%; }
  .overview-content .a .text h3, 
  .overview-content .a .text h4 { font-size:4vw; line-height:1.2; padding-top:1%; text-align:center; }
  .overview-content .b { background:url(m/b.jpg) 50% 100% / 100% auto no-repeat; height:auto; padding-bottom:71.4%; }
  .overview-content .b .text { padding:0; width:auto; }
  .overview-content .b .text h2 { font-size:2.5rem; padding:3rem 6% 2rem; }
  .overview-content .b .text p { font-size:1.75rem; padding:0 6% 2rem; }
  .overview-content .c { background:none; height:auto; }
  .overview-content .c .text { color:#000; padding:0; }
  .overview-content .c .text h2 { font-size:2.5rem; padding:3rem 6% 2rem; }
  .overview-content .c .text p { font-size:1.75rem; padding:0 6% 2rem; width:auto; }
  .overview-content .c .chart { background:url(m/c.png) 50% 0 / 100% auto no-repeat; height:0; padding-bottom:113.75%; }
  .overview-content .c .chart p { padding:82vw 0 0; }
  .overview-content .c .chart span { line-height:3.75vw; }
  .overview-content .c .chart span:nth-child(1) { font-size:2.8vw; padding-left:8vw; width:15vw; }
  .overview-content .c .chart span:nth-child(2) { font-size:2.4vw; text-indent:3vw; width:23.4vw; }
  .overview-content .c .chart span:nth-child(3) { font-size:2.5vw; padding-left:2.5vw; }
  .overview-content .c .chart p+p { padding-top:4vw; }
  .overview-content .c .chart p+p span:nth-child(2) { width:33.8vw; }
  .overview-content .c .icons { display:none; }
  .overview-content .d { background:#f6f6f6; }
  .overview-content .d .text { padding:0; text-align:left; width:auto; }
  .overview-content .d .text h2 { font-size:2.5rem; padding:3rem 6% 2rem; }
  .overview-content .d .text p { font-size:1.75rem; padding:0 6% 3rem; }
  .overview-content .e,
  .overview-content .f { text-align:left; }
  .overview-content .e .title,
  .overview-content .f .title { padding:0; text-align:left; }
  .overview-content .e .title h3,
  .overview-content .f .title h3 { font-size:2.25rem; padding:3rem 6% 0; }
  .overview-content .e .title h3:before,
  .overview-content .f .title h3:before,
  .overview-content .e .title h3:after,
  .overview-content .f .title h3:after { display:none; }
  .overview-content .e .sec,
  .overview-content .f .sec { display:block; height:auto; padding:0; width:auto; }
  .overview-content .e .sec .bg,
  .overview-content .f .sec .bg,
  .overview-content .e .sec .wifi,
  .overview-content .f .sec .wifi,
  .overview-content .e .sec .text p,
  .overview-content .f .sec .text p{ display:none; }
  .overview-content .e .sec .text,
  .overview-content .f .sec .text { background:none; min-height:0!important; padding:0; position:static; }
  .overview-content .e .sec .text h4,
  .overview-content .f .sec .text h4 { color:#000; font-size:1.5rem; padding:2rem 6% 1.5rem; }
  .overview-content .e .sec .cover,
  .overview-content .f .sec .cover { background:none; margin-left:12.5vw; opacity:1; position:relative; }
  .overview-content .e .sec .cover .icons,
  .overview-content .f .sec .cover .icons { margin:0 0 5vw 0; position:static; }
  .overview-content .e .sec .cover p,
  .overview-content .f .sec .cover p { bottom:-3vw; color:#000; font-size:2vw; width:20vw; }
  .overview-content .e { background:url(m/e.jpg) 50% 100% / 100% auto no-repeat; padding-bottom:72%; }
  .overview-content .e .e1 .cover .icons { background:url(m/e1.png) 50% 0 / 100% auto no-repeat; height:11.1vw; width:56vw; }
  .overview-content .e .e1 .cover .p1 { left:-6.5vw; }
  .overview-content .e .e1 .cover .p2 { left:5.5vw; }
  .overview-content .e .e1 .cover .p3 { left:24vw; }
  .overview-content .e .e1 .cover .p4 { left:35vw; }
  .overview-content .e .e1 .cover .p5 { left:43.5vw; }
  .overview-content .e .e2 .cover .icons { background:url(m/e2.png) 50% 0 / 100% auto no-repeat; height:11.6vw; width:54.5vw; }
  .overview-content .e .e2 .cover .p1 { left:-7.3vw; }
  .overview-content .e .e2 .cover .p2 { left:4.5vw; }
  .overview-content .e .e2 .cover .p3 { left:22.6vw; }
  .overview-content .e .e2 .cover .p4 { left:33.6vw; }
  .overview-content .e .e2 .cover .p5 { left:42vw; }
  .overview-content .f { background:url(m/f.jpg) 50% 100% / 100% auto no-repeat; padding-bottom:70%; }
  .overview-content .f .f1 .cover .icons { background:url(m/f1.png) 50% 0 / 100% auto no-repeat; height:11.5vw; width:68vw; }
  .overview-content .f .f1 .cover .p1 { left:-6.6vw; }
  .overview-content .f .f1 .cover .p2 { left:5.5vw; }
  .overview-content .f .f1 .cover .p3 { left:17.7vw; }
  .overview-content .f .f1 .cover .p4 { left:36vw; }
  .overview-content .f .f1 .cover .p5 { left:46.7vw; }
  .overview-content .f .f1 .cover .p6 { left:55.5vw; }
  .overview-content .f .f2 .cover .icons { background:url(m/f2.png) 50% 0 / 100% auto no-repeat; height:11.4vw; width:65.4vw; }
  .overview-content .f .f2 .cover .p1 { left:-6.6vw; }
  .overview-content .f .f2 .cover .p2 { left:5.5vw; }
  .overview-content .f .f2 .cover .p3 { left:22.5vw; }
  .overview-content .f .f2 .cover .p4 { left:36.5vw; width:40vw; }
  .overview-content .f .f3 .cover .icons { background:url(m/f3.png) 50% 0 / 100% auto no-repeat; height:11.3vw; width:65.4vw; }
  .overview-content .f .f3 .cover .p1 { left:-6.8vw; }
  .overview-content .f .f3 .cover .p2 { left:4.9vw; }
  .overview-content .f .f3 .cover .p3 { left:16.7vw; }
  .overview-content .f .f3 .cover .p4 { left:34.1vw; }
  .overview-content .f .f3 .cover .p5 { left:44.8vw; } 
  .overview-content .f .f3 .cover .p6 { left:53vw; }
  .overview-content .g { padding:0; }
  .overview-content .g .text { padding:0; text-align:left; }
  .overview-content .g .text h2 { font-size:2.5rem; padding:3rem 6% 2rem; }
  .overview-content .g .text p { font-size:1.75rem; padding:0 6%; }
  .overview-content .g .img { background:url(m/g.png) 50% 0 / 100% auto no-repeat; height:0; margin:0; padding-bottom:48.4%; }
  .overview-content .g .img p { font-size:2vw; left:46vw; width:20vw; }
  .overview-content .g .img .p1 { top:17vw; }
  .overview-content .g .img .p2 { top:35vw; }
}