.slider {
	border-bottom: 1px solid #ccc;
}
.slider__item {
	display: flex;
	justify-content: center;
	flex-direction: column;
	height: 360px;
	background-position: 30% center;
	background-size: cover;
	background-image: url('../img/proteccion/slider.jpg');
}
.slider__item__content {
	margin: auto;
}
.slider__title {
	color: #fff;
	font-size: 22px;
	font-weight: normal;
	text-align: center;
	padding: 0 20px;
	margin-bottom: 20px;
}
.slider__txt {
	font-size: 14px;
	color: #fff;
	line-height: 18px;
	text-align: center;
	padding: 0 20px;
	margin-bottom: 20px;
}

.steps {
	padding: 30px 20px;
	text-align: center;
	background-color: #f5f5f5;
}
.steps__content {
	position: relative;
}
.steps__title {
	font-size: 16px;
	margin-bottom: 20px;
}
.steps__box {
	position: absolute;
	width: 200px;
}
.steps__box.s1 {
	left: 50%; 
    transform: translate(-50%);
}
.steps__box.s2 {
	width: 140px;
	top: 280px;
	left: 0;
}
.steps__box.s3 {
	width: 140px;
	top: 280px;
	right: 0;
}
.steps__box__title {
	font-size: 14px;
	margin-bottom: 10px;
}
.steps__box__txt {
	margin: auto;
	font-size: 12px;
	line-height: 16px;
}
.steps__box.s2 .steps__box__title {
	text-align: left;
}
.steps__box.s2 .steps__box__txt {
	text-align: left;
	margin: 0;
}
.steps__box.s3 .steps__box__title {
	text-align: right;
}
.steps__box.s3 .steps__box__txt {
	text-align: right;
	margin: 0;
}
.steps__img {
	width: 280px;
	margin-top: 60px;
	margin-bottom: 130px;
}

.step {
	padding: 30px 20px;
	background-color: #f5f5f5;
}
.step__title {
	display: flex;
	align-items: center;
	grid-gap: 10px;
	font-size: 18px;
	margin-bottom: 20px;
}
.step__title img {
	width: 50px;
}
.step__txt {
	font-size: 14px;
	line-height: 20px;
	margin-bottom: 20px;
	text-align: justify;
}
.step__right {
	text-align: center;
}
.step__img {
	width: 280px;
}
.step.s2 {
	color: #fff;
	background-color: #002e5a;
}

.plans {
	padding: 30px 20px;
	background-color: #002e5a;
	margin-bottom: 10px;
}
.plans__title {
	color: #fff;
	font-size: 18px;
	margin-bottom: 20px;
}
.plans__row {
	display: flex;
	flex-direction: column;
	grid-gap: 20px;
}
.plans__box {
	position: relative;
	padding: 20px;
	border-radius: 20px;
	background-color: #e2e2e2;
}
.plans__box__title {
	color: #fff;
	text-align: center;
	border-radius: 20px;
	padding: 6px 0;
	background-color: #002e5a;
	margin-bottom: 20px;
}
.plans__box__subtitle {
	font-weight: bold;
}
.plans__box__desc {
	margin-bottom: 20px;
}
.plans__box__desc:last-child {
	margin-bottom: 0;
}
.plans__img {
	position: absolute;
	right: 0;
	bottom: -10px;
	width: 40px;
}

.plans__box.p2 {
	background-color: #fff;
}
.plans__box.p2 .plans__box__title {
	color: #000;
	background-color: #e2e2e2;
}

@media screen and (min-width: 360px) {

	.slider__item__content {
		width: 320px;
	}
	.steps__img {
		width: 320px;
	}
	.steps__box.s2 {
		top: 280px;
	}
	.steps__box.s3 {
		top: 280px;
	}
	.step {
		padding: 20px;
	}
	.step__img {
		width: 320px;
	}
	
}

@media screen and (min-width: 500px) {

	.slider__item {
		height: 500px;
	}
	.slider__item__content {
		width: 460px;
	}
	.slider__title {
		font-size: 28px;
	}
	.slider__txt {
		font-size: 16px;
	}
	.steps__content {
		width: 420px;
		margin: auto;
	}
	.steps__title {
		font-size: 18px;
	}
	.steps__box.s1 {
		top: 70px;
	}
	.steps__box.s1 .steps__box__title {
		margin-bottom: 60px;
	}
	.steps__box.s1 .steps__box__txt {
		color: #fff;
	}
	.steps__box.s2 {
		top: 340px;
		left: 0;
		width: 200px;
	}
	.steps__box.s3 {
		top: 340px;
		right: 0;
		width: 200px;
	}
	.steps__box__title {
		font-size: 16px;
	}
	.steps__box__txt {
		font-size: 14px;
	}
	.steps__img {
		width: 420px;
	}
	.step__img {
		width: 380px;
	}
	.plans__title {
		width: 400px;
		line-height: 30px;
	}
	.plans__box {
		width: 300px;
		margin: auto;
	}
	
}

@media screen and (min-width: 768px) {

	.slider__item__content {
		width: 600px;
	}
	.slider__title {
		font-size: 40px;
	}
	.slider__txt {
		font-size: 16px;
	}
	.steps {
    	padding: 40px 10px;
	}
	.steps__content {
		width: 560px;
	}
	.steps__title {
		font-size: 20px;
	}
	.steps__img {
		width: 100%;
		margin-bottom: 0;
	}
	.steps__box__title {
		font-size: 18px;
	}
	.steps__box__txt {
		line-height: 20px;
	}
	.steps__box.s1 .steps__box__title {
		margin-bottom: 60px;
	}
	.steps__box.s1 .steps__box__txt {
		width: 160px;
		line-height: 20px;
	}
	.steps__box.s2 {
		width: 220px;
		top: 100px;
		left: -100px;
	}
	.steps__box.s2 .steps__box__title {
		text-align: center;
	}
	.steps__box.s2 .steps__box__txt {
		width: 160px;
		text-align: center;
		margin: auto;
	}
	.steps__box.s3 {
		width: 220px;
		top: 100px;
		right: -110px;
	}
	.steps__box.s3 .steps__box__title {
		text-align: center;
	}
	.steps__box.s3 .steps__box__txt {
		width: 180px;
		text-align: center;
		margin: auto;
	}
	.step {
		padding: 80px 20px;
	}
	.step__content {
		display: flex;
		flex-direction: row-reverse;
		grid-gap: 20px;
		align-items: center;
	}
	.step__left,
	.step__right {
		width: 50%;
	}
	.step.s2 .step__content {
		flex-direction: row;
	}
	.step__txt:last-child {
		margin-bottom: 0;
	}
	.plans {
		padding: 40px 20px;
	}
	.plans__title {
		width: 500px;
		font-size: 20px;
	}
	.plans__row {
		flex-direction: row;
	}
	.plans__box {
		margin: 0;
		height: 240px;
	}

}

@media screen and (min-width: 1000px) {

	.steps__title {
		font-size: 24px;
	}
	.steps__box.s2 {
        top: 240px;
        left: -210px;
    }
    .steps__box.s3 {
		top: 220px;
		right: -210px;
	}
	.step__content {
		width: 900px;
		margin: auto;
	}
	.step__title img {
		width: 60px;
	}
	.step__txt {
		margin-left: 50px;
	}
	.plans__title {
		margin-bottom: 40px;
	}
	.plans__content {
		width: 900px;
		margin: auto;
	}

}

@media screen and (min-width: 1200px) {

	.slider__item {
		height: 600px;
	}
	.slider__item__content {
		width: 900px;
	}
	.slider__title {
		font-size: 46px;
	}
	.slider__txt {
		font-size: 18px;
		line-height: 24px;
		margin-bottom: 30px;
	}
	.steps__box__title {
		font-size: 20px;
	}
	.steps__box__txt {
		font-size: 16px;
	}
	.steps__box.s2 {
		width: 250px;
		left: -230px;
	}
	.steps__box.s2 .steps__box__txt {
		width: 180px;
	}
	.steps__box.s3 .steps__box__txt {
		width: 200px;
	}
	.step__content {
		width: 1100px;
	}
	.step__title {
		font-size: 22px;
		grid-gap: 20px;
	}
	.step__txt { 
		font-size: 16px;
    	line-height: 24px;
		margin-left: 80px;
		width: 400px;
	}
	.step__img {
		width: 430px;
	}
	.plans {
		padding: 60px 20px;
	}
	.plans__title {
		font-size: 22px;
	}
	.plans__content {
		width: 900px;
	}
	.plans__row {
		justify-content: center;
	}
	.plans__box {
		width: 260px;
	}

}

@media screen and (min-width: 1400px) {

	.slider__item {
		height: 670px;
	}

}