.kids{
	padding: 9.5rem 1rem 140rem;
	background: #a09772;
	background: -moz-linear-gradient(top, transparent 0%,transparent 80%,#a09772 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, transparent 0%,transparent 80%,#a09772 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, transparent 0%,transparent 80%,#a09772 100%);
	position: relative;
	z-index: 98;
	.back{
		background: url($img_dir + 'guaranteed_bg.png') no-repeat center bottom;
		background-size: 100% auto;
	}
	@media screen and (max-width: 1700px){
		padding: 9.5rem 1rem 120rem;
	}
	@media screen and (max-width: 1600px){
		padding: 9.5rem 1rem 110rem;
	}
	@media screen and (max-width: 1360px){
		padding: 9.5rem 1rem 100rem;
	}
	@media screen and (max-width: 1240px){
		padding: 9.5rem 1rem 95rem;
	}
	@include br1{
		padding: 9.5rem 1rem 30rem;
	}
	.head{
		color: #000;
		font: 4rem $KR;
		z-index: 100;
		p{
			&:nth-child(2){
				height: 92px;
				width: 319px;
				max-width: 100%;
				margin-left: auto;
				margin-right: auto;
				@extend %center-flex;
				background: url($img_dir + 'kids_bg.png') no-repeat center 6px;
				background-size: contain;
				color: #fff;
			}
		}
	}
	.card{
		position: absolute;
		right: 0;
		bottom: 0;
		width: 45%;
		box-shadow: 0 0 4.6rem rgba(24, 24, 24, 0.75);
		background-color: #eedfba;
		padding: 25rem 23rem;
		z-index: 100;
		@include transform(rotate(10deg));
		@media screen and (max-width: 1700px){
			width: 50%;
		}
		@media screen and (max-width: 1600px){
			padding: 20rem 15rem 20rem 20rem;
		}
		@media screen and (max-width: 1360px){
			width: 55%;
		}
		@media screen and (max-width: 1240px){
			width: 60%;
			padding: 18rem 13rem 18rem 17rem;
		}
		@include br1{
			position: relative;
			@include transform(rotate(0));
			width: 100%;
			margin-top: 29rem;
			padding: 35rem 3rem 10rem 3rem;
		}
		@include br3{
			text-align: center;
			margin-top: 25rem;
		}
		img{
			position: absolute;
			top: 50%;
			left: -13rem;
			@include transform(translateY(-50%) rotate(-10deg));
			@include br1{
				top: -20rem;
				left: 50%;
				@include transform(translateY(0) translateX(-50%));
			}
			@include br3{
				max-width: 230px;
			}

		}
		&__head{
			color: #34332f;
			font: 4rem $KR;
			margin-bottom: 5rem;
			@include transform(rotate(-10deg));
			margin-left: -4rem;
			@include br1{
				@include transform(rotate(0));
				margin-left: 0;
			}
		}
		&__text{
			color: #3e3e3e;
			font: 2rem/2 $HR;
			@include transform(rotate(-10deg));
			@include br1{
				@include transform(rotate(0));
			}
		}
	}
}