@charset "UTF-8";
/* CSS Document */

.outddor-solution-guide { font-size:16px;font-weight: 300; overflow:hidden;max-width: 1920px;margin: 0 auto;overflow-x: hidden; }
.outddor-solution-guide .w1440 { margin:0 auto; position:relative; width:88em; }
.outddor-solution-guide .w1366 { margin:0 auto; position:relative; width:85.375em; }
.outddor-solution-guide .w1200 { margin:0 auto; position:relative; width:75em; }
.outddor-solution-guide .w1250 { margin:0 auto; position:relative; width:78.125em; }
.outddor-solution-guide .regular { font-weight: 400!important;}
.outddor-solution-guide .medium { font-weight: 500!important;}
.outddor-solution-guide .bold { font-weight: 700!important;}
.outddor-solution-guide .m-show { display:none; }
 .outddor-solution-guide .hide{display: none}
.outddor-solution-guide .nowrap { white-space:nowrap; }
.outddor-solution-guide .text>h2 { font-size:3.125em; line-height:1.2;font-weight: 400 }
.outddor-solution-guide .text>h3 { font-size:2.25em; line-height:1.2;padding-top: 1em; }
.outddor-solution-guide .text>p { font-size:1.25em; line-height:1.5; padding-top:1.5em; }
.outddor-solution-guide a{text-decoration:none;color: currentColor;cursor: pointer;}
.outddor-solution-guide a:hover{color:#4acbd6}
@media screen and (max-width:1440px){
  .outddor-solution-guide { font-size:1.111111111111vw; }
}
@media screen and (max-width:736px){
  html { font-size:10.35px; }
  .outddor-solution-guide .m-show { display:block; }
  .outddor-solution-guide .m-hide{display: none}
  .outddor-solution-guide .w1366,.outddor-solution-guide .w1250,.outddor-solution-guide .w1200,.outddor-solution-guide .w1440 { width:auto; }
  .outddor-solution-guide .text>h2 { font-size:2.25rem; padding:4rem 6% 2rem; }
  .outddor-solution-guide .text>h3 { font-size:2rem; padding:0 6% 2rem; }
  .outddor-solution-guide .text>p { font-size:1.75rem; line-height:1.5; padding:0 6% 2rem; }
}

/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/

.outddor-solution-guide .list{text-align: justify;}
.outddor-solution-guide .list:after{content: '';display: inline-block;width: 100%;}
.outddor-solution-guide .list li{display: inline-block;vertical-align: top;box-sizing: border-box;text-align: center;}
.outddor-solution-guide .list li i{display: block;margin: 0 auto;background-size: auto 100%;background-repeat: no-repeat;}
.outddor-solution-guide .banner{background: url(../images/hero.jpg) center/122em auto no-repeat;height: 42.6em;}
.outddor-solution-guide .banner .text{text-align: left;color: #fff;padding: 14.9em 0 0;}
.outddor-solution-guide .banner .text h1{font-size: 2.7em;line-height: 1.1; font-weight:500;}
.outddor-solution-guide .banner h3{font-size: 1.6em;padding-top: 0.5em;}
.outddor-solution-guide .banner p{font-size: 1.3em;}


.outddor-solution-guide .a{text-align: center; padding:3.5em 0 3em 0; font-weight:300;}
.outddor-solution-guide .a .subtext{display: inline-block;vertical-align: top;text-align: left;color: #333333;box-sizing: border-box;}
.outddor-solution-guide .a .subtext h2{font-size: 2.7em;font-weight: 500;padding: 0 8% .5em;line-height: 1.5; text-align: center}
.outddor-solution-guide .a .subtext h3{font-size: 1.75em;font-weight: 500;padding: 0 8% .5em;line-height: 1.2; text-align: center;}
.outddor-solution-guide .a .subtext p{font-size: 1.38em;padding: 0;position: relative; line-height: 1.5}

.outddor-solution-guide .a .text1{width: 55%;padding-left: 2%;padding-right:3%}
.outddor-solution-guide .a .text1 p{margin-bottom:1.5em}
.outddor-solution-guide .a .text2 p:not(.note):before{content: '';width: 1.25em;height: 1.25em;position: absolute;top: 0.25em;left: 6%;background: url(https://www.tp-link.com/res/images/icons/icon-arrow.svg) center/contain no-repeat;}
.outddor-solution-guide .a .text2 p{padding-left:12%}
.outddor-solution-guide .a .text2{width: 40%;padding-right: 2%; color:#145361; }
.outddor-solution-guide .a .text2 .bluecontainer {background-color: #D3F0F9; margin-bottom:1em;margin-top:1em; border-radius: 1.5em;padding:1.5em 0;}


.outddor-solution-guide .b{background: #d3f0f9;padding: 4.5em 0 4.5em 0;}
.outddor-solution-guide .b ul{text-align: justify; }
.outddor-solution-guide .b ul:after{content: '';display: inline-block;width: 100%;}
.outddor-solution-guide .b li{display: inline-block;width: 18%;vertical-align: top;text-align: center;}
.outddor-solution-guide .b li .scene{display: block;margin: 0 auto;height:0;padding-bottom:90%;background-position:center;background-size: contain;background-repeat: no-repeat;}
.outddor-solution-guide .b .backyard .scene{background-image: url(../images/backyard.png);}
.outddor-solution-guide .b .stadium .scene{background-image: url(../images/High-School-Football-Stadium.png);}
.outddor-solution-guide .b .cinema .scene{background-image: url(../images/Backyard-Cinema.png);}
.outddor-solution-guide .b .pool .scene{background-image: url(../images/swimming-pool.png);}
.outddor-solution-guide .b .remote-camera .scene{background-image: url(../images/Remote-Surveillance-Camera.png);}
.outddor-solution-guide .b .parking-lot .scene{background-image: url(../images/parking-lot.png);}
.outddor-solution-guide .b .rv-park .scene{background-image: url(../images/RV-Park.png);}
.outddor-solution-guide .b .yacht-club .scene{background-image: url(../images/Yacht-Club.png);}
.outddor-solution-guide .b .highway-billboard .scene{background-image: url(../images/highway-billboard.png);}
.outddor-solution-guide .b .hotel-pool .scene{background-image: url(../images/htel-swimming-pool.png);}
.outddor-solution-guide .b li h4{padding: 1.3em 0.5em 2.7em 0.5em;font-weight: 500;font-size: 1.2em; line-height: 1.2;}
.outddor-solution-guide .b li a {color: #085266; }
.outddor-solution-guide .b p{font-size: 1.3em; text-align: center;}


.outddor-solution-guide .c{text-align: center; padding:1em 0 2em 0; font-weight:300;}
.outddor-solution-guide .c .contacttext{display: inline-block;vertical-align: top;text-align: left;color: #333333;}
.outddor-solution-guide .c .contacttext p{font-size: 1.5em;padding: 0;line-height: 1.5; top:0.2em; left:2.2em}
.outddor-solution-guide .c .contacttext img{width:2em; top:0.6em; position: relative}
.outddor-solution-guide .c .contacttext a{color:#4ACBD6;text-decoration: underline}


@media screen and (max-width:736px){
  .outddor-solution-guide .banner{background: url(../images/hero_m.jpg) center/100% no-repeat;height: 0;padding-bottom: 100%;}
  .outddor-solution-guide .banner .text{padding: 10vw 0 0;text-align: center;}
  .outddor-solution-guide .banner img{width: 50vw;margin: 0 6%;}
  .outddor-solution-guide .banner .text h1{font-size: 6.75vw;padding: 2vw 6%;}
  .outddor-solution-guide .banner h3{font-size: 4.1vw;padding: 1vw 6%;}
  .outddor-solution-guide .banner p{font-size: 3.5vw;padding-top: 1vw;}
	
.outddor-solution-guide .a .subtext{width:88%;margin: 1rem auto 0 auto; padding:0; }
.outddor-solution-guide .a .subtext h2{font-size:2.2rem;padding:1rem 0 1rem 0; font-weight:400; margin:0 0 2rem 0; line-height:1.1; }
.outddor-solution-guide .a .subtext h3{font-size:1.875rem;padding:1.2rem 2rem; margin:0; float: left; display: block; width:22%; }
.outddor-solution-guide .a .subtext p{font-size: 1.6rem;padding: 0 0 1rem; line-height: 1.5;margin:0; }

.outddor-solution-guide .a .text1{width: 88%;padding:0 ; margin-bottom:0;padding-bottom:0}
.outddor-solution-guide .a .text1 p{margin:0 0 1.5em 0; padding:0}
.outddor-solution-guide .a .text2 p:not(.note):before{left:1rem}
.outddor-solution-guide .a .text2 p{font-size:1.4rem;float: left; padding:0.2rem 0 0 3rem; position: relative; width:60%; }
	.outddor-solution-guide .a .text2 .bluecontainer { width:99%;padding:1.5rem 1.5em 1.5rem 0;  margin:0 0 2rem 0; display: block; float: left}
	

  .outddor-solution-guide .b ul{width: 88%;margin: 0 auto;}
  .outddor-solution-guide .b li{width: 45%;margin-bottom: 2rem;}
  .outddor-solution-guide .b li h4{font-size: 1.4rem;padding: 0.8em 0 0.125em;font-weight: 500}
  .outddor-solution-guide .b li p{font-size: 1.35rem;}
  .outddor-solution-guide .b .link{padding: 0 6%;}
  .outddor-solution-guide .b .link a{font-size: 1.35rem;}
 .outddor-solution-guide .b p{font-size: 3.5vw;padding-top: 1vw;}

.outddor-solution-guide .c {font-size: 1.4rem; }
	
 
}


@media screen and (max-width:530px){
.outddor-solution-guide .a .subtext h3{float: none; width:88%; }

.outddor-solution-guide .a .text2 p:not(.note):before{left:2rem}
.outddor-solution-guide .a .text2 p{font-size:1.5rem;float: none; padding:0.2rem 0 0 4.5rem; position: relative; width:80%; }
	.outddor-solution-guide .a .text2 .bluecontainer { width:99%;padding:1.2rem 1.2em 2.8rem 0;  margin:0 0 2rem 0; display: block; float: none}
}
/*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*/