section.whyus{

  padding-top: 50px;
}
section.whyus .content{
    position: relative;
  z-index: 2;
}
section.whyus .content:after{
   content: " ";
   display: block;
   height: 0;
   clear: both;
}
section.whyus .content .left{

  float: left;
  width: 50%;
  margin-top: 75px;
}
section.whyus .content .left .column{

  float: left;
  width: 290px;
  margin-right: 34px;
}
section.whyus .content .left .column.second{
  padding-top:50px;
  margin-right: 0px;
}
section.whyus .content .left .column .item{

  background-color: var(--primary);
  margin-bottom: 34px;
  padding: 95px 60px 50px;
  height: 280px;
  position: relative;
  overflow: hidden;
}
section.whyus .content .left .column .item .layer{

  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;

  -webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;

  opacity: 0;
}
section.whyus .content .left .column .item:hover .layer{
opacity: 1;
  top: 0;

}
section.whyus .content .left .column .item .layer img{

  width: 100%;
  height: 100%;
  object-fit: cover;
}
section.whyus .content .left .column .item .icon{
  -webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
  margin-bottom: 30px;
  z-index: 2;
  position: relative;
}

section.whyus .content .left .column .item:hover .icon{
  filter: grayscale(100%) brightness(300%);
}

section.whyus .content .left .column .item .icon img{

}
section.whyus .content .left .column .item h4 {

  font-size: 18px;
  color: white;
  line-height: 22px;
  width: 140px;
  position: relative;
  z-index: 2;
}
section.whyus .content .right{

  float: right;
  width: 50%;
}
section.whyus .content .right .inner{
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  padding: 100px 67px 0 110px;
}

section.whyus .content .right .inner h3{
color:var(--primary);

margin-bottom: 25px;
}
/* [L] */
@media all and (max-width: 1249px)  {
	section.whyus{

	}

	section.whyus .content{

	}

	section.whyus .content:after{

	}

	section.whyus .content .left{

	}

	section.whyus .content .left .column{

	width: 212px;
	}

	section.whyus .content .left .column.second{

	}

	section.whyus .content .left .column .item{

	}

	section.whyus .content .left .column .item .layer{

	}

	section.whyus .content .left .column .item:hover .layer{

	}

	section.whyus .content .left .column .item .layer img{

	}

	section.whyus .content .left .column .item .icon{

	}

	section.whyus .content .left .column .item:hover .icon{

	}

	section.whyus .content .left .column .item .icon img{

	}

	section.whyus .content .left .column .item h4 {

	}

	section.whyus .content .right{

	}

	section.whyus .content .right .inner{

	padding-left: 50px;
	}

	section.whyus .content .right .inner h3{

	}

}

/* [M] */
@media all and (max-width: 940px) {
	section.whyus{

	}

	section.whyus .content{

	}

	section.whyus .content:after{

	}

	section.whyus .content .left{

	width: 100%;
	float: unset;
	margin-top: 0;
	}
	section.whyus .content .left:after{
   content: " ";
   display: block;
   height: 0;
   clear: both;
}


	section.whyus .content .left .column{

	width: 46%;
	margin: 0px 10px;
	}

	section.whyus .content .left .column:after{
   content: " ";
   display: block;
   height: 0;
   clear: both;
}
	section.whyus .content .left .column.second{

	}

	section.whyus .content .left .column .item{

	padding: 25px 25px 15px;
	height: unset;
	text-align: center;
	}

	section.whyus .content .left .column .item .layer{

	}

	section.whyus .content .left .column .item:hover .layer{

	}

	section.whyus .content .left .column .item .layer img{

	}

	section.whyus .content .left .column .item .icon{

	margin-bottom: 15px;
	}

	section.whyus .content .left .column .item:hover .icon{

	}

	section.whyus .content .left .column .item .icon img{

	}

	section.whyus .content .left .column .item h4 {

	width: 100%;
	}

	section.whyus .content .right{

	width: 100%;
	float: unset;
	text-align: center;
	margin-top: 15px;
	}

	section.whyus .content .right .inner{

	position: relative;
	padding: 0;
	margin-top: 0;
	clear: both;
	transform: unset;
	}

	section.whyus .content .right .inner h3{

	font-size: 30px;
	line-height: 35px;
	}

}

/* [S] */
@media all and (max-width: 520px) {
	section.whyus{

	padding-top: 10px;
	}

	section.whyus .content{

	}

	section.whyus .content:after{

	}

	section.whyus .content .left{

	text-align: center;
	padding-top: 35px;
	}

	section.whyus .content .left .column{

	width: 100%;
	margin: 0;
	}

	section.whyus .content .left .column.second{

	padding-top: 0;
	}

	section.whyus .content .left .column .item{

	margin-bottom: 25px;
	width: 100%;
	display: inline-block;
	}

	section.whyus .content .left .column .item .layer{

	}

	section.whyus .content .left .column .item:hover .layer{

	}

	section.whyus .content .left .column .item .layer img{

	}

	section.whyus .content .left .column .item .icon{

	margin: bo;
	}

	section.whyus .content .left .column .item:hover .icon{

	}

	section.whyus .content .left .column .item .icon img{

	}

	section.whyus .content .left .column .item h4 {

	}

	section.whyus .content .right{

	}

	section.whyus .content .right .inner{

	}

	section.whyus .content .right .inner h3{

	}

}