#april-banner{
    width: 100%;
	background-image: url(../../../images/25/april/banner/back.jpg);
	background-image: -webkit-image-set(url("../../../images/25/april/banner/back.jpg") 1x, url("../../../images/25/april/banner/back@2x.jpg") 2x);
	background-size: cover;
	background-position: center bottom;
	background-repeat: no-repeat;
	font-size: 16px;
    width: 68vw;
    --purple: #8a32ae;
    margin-bottom: 25px;
}
#april-banner .b-purple {
    background-color: var(--purple) !important;
}
#april-banner .banner-inner{
	height: auto;
	padding: 0 15px;
    gap: 2vw;
}
#april-banner .banner-main{
    width: 19vw;
    padding-top: 19px;
    padding-bottom: 9px;
}
#april-banner .banner-image img {
    width: 18vw;
}
#april-banner .banner-cta{
}
#april-banner .banner-cta img {
    width: 15vw;
}
#april-banner .button{
	font-size: 1.0625em;
	width: 164px;
	height: 28px;
    border-radius: 14px;
	margin-top: 20px;
}

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

    #april-banner {
        max-width: 100%;
        margin-bottom: 20px;
        background-image: url(../../../images/25/april/banner/back-m.jpg);
        background-image: -webkit-image-set(url("../../../images/25/april/banner/back-m.jpg") 1x, url("../../../images/25/april/banner/back-m@2x.jpg") 2x);
        width: 90%;
    }
	#april-banner .banner-inner{
		flex-direction: column;
        padding: 0;
        width: 100%;
	}
    #april-banner .banner-main {
        padding-top: 14px;
        padding-bottom: 0;
        width: 100%;
    }
    #april-banner .banner-main img {
        width: 77%;
    }
    #april-banner .banner-cta {
        align-self: center;
        margin: 0;
        order: 2;
        width: 100%;
    }
    #april-banner .banner-cta img {
        width: 55%;
    }
    #april-banner .banner-image img {
        width: 100%;
    }
    #april-banner .banner-image {
        order: 3;
        width: 100%;
    }
    #april-banner .button {
        margin-top: 8px;
    }
}
