@CHARSET "UTF-8";

/* 
	*********** 타이틀 이미지 디자인 ******************
 */
#sub-page .container-intro.mem-intro #intro .wrap.membership .title-slg{
	color: #fff !important;
	font-size:36px;
}
#sub-page .container-intro.mem-intro .col-md-12{
	z-index:3;
	
	
}
/* 혜택 */
#sub-page .container-intro.mem-intro.benefit #intro .wrap.membership .title-small{
	color: #fff !important;	
}
#sub-page .container-intro.mem-intro.benefit {
	position:relative;
    width: 100%;
    background-color: #00C2B7;
    background-image:url() !important;
    /* background-image: linear-gradient(135deg, white 65vw, #4F7DFF 50%); */
}
#sub-page .container-intro.mem-intro.benefit .subtop-background-up-round{
   	position: absolute;
    right: 5%;
    width: 196px;
    background-image: linear-gradient(0deg, #00C2B7 15%, #33cfc6 72%, #19e3d8 100%);
    height: 196px;
    z-index: 1;
    top: 67px;
    border-radius: 103px;
    margin-right: 53px;
}
#sub-page .container-intro.mem-intro.benefit img{
	width: 970px;
    position: absolute;
    right: 5%;
    top: 48px;
    z-index:2;
}

/* 포인트 */
#sub-page .container-intro.mem-intro.point #intro .wrap.membership .title-small{
	color: #fff !important;	
}
#sub-page .container-intro.mem-intro.point {
	position:relative;
    width: 100%;
    background-color: #F24675;
    background-image:url() !important;
    /* background-image: linear-gradient(135deg, white 65vw, #4F7DFF 50%); */
}
#sub-page .container-intro.mem-intro.point .subtop-background-up-round{
   	position: absolute;
    right: 5%;
    width: 196px;
    background-image: linear-gradient(0deg, #F24675 15%, #f15882 72%, #f17f9e 100%);
    height: 196px;
    z-index: 1;
    top: 67px;
    border-radius: 103px;
    margin-right: 53px;
}
#sub-page .container-intro.mem-intro.point img{
    width: 1176px;
    position: absolute;
    right: 1%;
    top: 51px;
    z-index: 2;
}

/* 이벤트 */
#sub-page .container-intro.mem-intro.event #intro .wrap.membership .title-small{
	color: #fff !important;	
}
#sub-page .container-intro.mem-intro.event {
	position:relative;
    width: 100%;
    background-color: #F24675;
    background-image:url() !important;
    /* background-image: linear-gradient(135deg, white 65vw, #4F7DFF 50%); */
}
#sub-page .container-intro.mem-intro.event .subtop-background-up-round{
   	position: absolute;
    right: 5%;
    width: 196px;
    background-image: linear-gradient(0deg, #F24675 15%, #f15882 72%, #f17f9e 100%);
    height: 196px;
    z-index: 1;
    top: 67px;
    border-radius: 103px;
    margin-right: 53px;
}
#sub-page .container-intro.mem-intro.event img{
	width: 1176px;
    position: absolute;
    right: 1%;
    top: 51px;
    z-index: 2;
}

/* VIP */
#sub-page .container-intro.mem-intro.vip #intro .wrap.membership .title-small{
	color: #fff !important;	
}
#sub-page .container-intro.mem-intro.vip {
	position:relative;
    width: 100%;
    background-color: #653D00;
    background-image:url() !important;
    /* background-image: linear-gradient(135deg, white 65vw, #4F7DFF 50%); */
}
#sub-page .container-intro.mem-intro.vip .subtop-background-up-round{
   	position: absolute;
    right: 5%;
    width: 196px;
    background-image: linear-gradient(0deg, #653D00 15%, #895c18 72%, #7f6030 100%);
    height: 196px;
    z-index: 1;
    top: 67px;
    border-radius: 103px;
    margin-right: 53px;
}
#sub-page .container-intro.mem-intro.vip img{
	width: 970px;
    position: absolute;
    right: 5%;
    top: 48px;
    z-index:2;
}

#sub-page .container-intro #intro{
    width: 100%;
    position: relative;
    max-width: 1140px;
}

/* 
********	반응형 css   *********************
 */

@media (max-width: 768px){
	/* 서브 타이틀 디자인 */
	#sub-page .container-intro.mem-intro #intro .wrap.membership .title-slg{
		font-size: 26px;
	}

	/* 혜택 */
	#sub-page .container-intro.mem-intro.benefit {
		background-color: #00C2B7;
	    /* background-image: linear-gradient(135deg, white 71vw, #4F7DFF 50%); */
	}
	#sub-page .container-intro.mem-intro.benefit .subtop-background-up-round{
	    right: 0%;
	    top: 64px;
	}
	#sub-page .container-intro.mem-intro.benefit img{
        right: 0%;
        top: 42px;
	}
	#sub-page .container-intro.mem-intro.point #intro .wrap.membership .title-slg{
		font-size:26px;
	}
	/* 포인트 */
	#sub-page .container-intro.mem-intro.point {
		background-color: #F24675;
	    /* background-image: linear-gradient(135deg, white 71vw, #4F7DFF 50%); */
	}
	#sub-page .container-intro.mem-intro.point .subtop-background-up-round{
	    right: 0%;
	    top: 64px;
	}
	#sub-page .container-intro.mem-intro.point img{
        width: 1034px;
        right: -3%;
        top: 54px;
	}
	#sub-page .container-intro.mem-intro.point #intro .wrap.membership .title-slg{
		font-size:26px;
	}
	/* 이벤트 */
	#sub-page .container-intro.mem-intro.event {
		background-color: #F24675;
	    /* background-image: linear-gradient(135deg, white 71vw, #4F7DFF 50%); */
	}
	#sub-page .container-intro.mem-intro.event .subtop-background-up-round{
	    right: 0%;
	    top: 64px;
	}
	#sub-page .container-intro.mem-intro.event img{
        width: 1034px;
        right: -3%;
        top: 54px;
	}
	#sub-page .container-intro.mem-intro.event #intro .wrap.membership .title-slg{
		font-size:26px;
	}
	/* VIP */
	#sub-page .container-intro.mem-intro.vip {
		background-color: #653D00;
	    /* background-image: linear-gradient(135deg, white 71vw, #4F7DFF 50%); */
	}
	#sub-page .container-intro.mem-intro.vip .subtop-background-up-round{
	    right: 0%;
	    top: 64px;
	}
	#sub-page .container-intro.mem-intro.vip img{
        right: 0%;
        top: 42px;
	}
	#sub-page .container-intro.mem-intro.vip #intro .wrap.membership .title-slg{
		font-size:26px;
	}
	
}

@media (max-width: 540px){
	
	/* 서브 타이틀 디자인 */
	/* 혜택 */
	#sub-page .container-intro.mem-intro.benefit #intro .wrap.membership .title-slg{
 		font-size:18px;
 	}
 	
 	 #sub-page .container-intro.mem-intro.benefit img{
		width: 680px;
        top: 8px;
        right: -3%;
	}
	#sub-page .container-intro.mem-intro.benefit .subtop-background-up-round{
    	width: 134px;
        height: 134px;
        top: 24px;
        margin-right: 32px;
	}
 	
	/* 포인트 */
	#sub-page .container-intro.mem-intro.point #intro .wrap.membership .title-slg{
 		font-size:18px;
 	}
 	
 	 #sub-page .container-intro.mem-intro.point img{
		width: 680px;
        top: 8px;
        right: -3%;
	}
	#sub-page .container-intro.mem-intro.point .subtop-background-up-round{
       	width: 134px;
        height: 134px;
        top: 24px;
        margin-right: 32px;
	}
 	
 	/* 이벤트 */
	#sub-page .container-intro.mem-intro.event #intro .wrap.membership .title-slg{
 		font-size:18px;
 	}
 	
 	 #sub-page .container-intro.mem-intro.event img{
		width: 680px;
        top: 8px;
        right: -3%;
	}
	#sub-page .container-intro.mem-intro.event .subtop-background-up-round{
       	width: 134px;
        height: 134px;
        top: 24px;
        margin-right: 32px;
	}
 	
 	/* VIP */
	#sub-page .container-intro.mem-intro.vip #intro .wrap.membership .title-slg{
 		font-size:18px;
 	}
 	
 	 #sub-page .container-intro.mem-intro.vip img{
        width: 720px;
        top: 8px;
        right: -2%;
	}
	#sub-page .container-intro.mem-intro.vip .subtop-background-up-round{
       	width: 134px;
        height: 134px;
        top: 24px;
        margin-right: 32px;
	}
}

@media (max-width: 420px) {
	
	/* 서브 타이틀 디자인 */
	/* 혜택 */
	#sub-page .container-intro.mem-intro.benefit #intro .wrap.membership .title-slg{
 		font-size:18px;
 	}
 	
 	 #sub-page .container-intro.mem-intro.benefit img{
		top:24px;
 		width: 558px;
	}
	#sub-page .container-intro.mem-intro.benefit .subtop-background-up-round{
       	top:24px;
 		margin-right: 17px;
	}
 	
	/* 포인트 */
	#sub-page .container-intro.mem-intro.point #intro .wrap.membership .title-slg{
 		font-size:18px;
 	}
 	
 	 #sub-page .container-intro.mem-intro.point img{
		top:24px;
 		width: 558px;
	}
	#sub-page .container-intro.mem-intro.point .subtop-background-up-round{
       	top:24px;
 		margin-right: 17px;
	}
	
 	/* 이벤트 */
	#sub-page .container-intro.mem-intro.event #intro .wrap.membership .title-slg{
 		font-size:18px;
 	}
 	
 	 #sub-page .container-intro.mem-intro.event img{
		top:24px;
 		width: 558px;
	}
	#sub-page .container-intro.mem-intro.event .subtop-background-up-round{
       	top:24px;
 		margin-right: 17px;  
	}
	
 	/* VIP */
	#sub-page .container-intro.mem-intro.vip #intro .wrap.membership .title-slg{
 		font-size:18px;
 	}
 	
 	 #sub-page .container-intro.mem-intro.vip img{
		top: 8px;
        width: 720px;
        right: -25px;
	}
	#sub-page .container-intro.mem-intro.vip .subtop-background-up-round{
       	top:24px;
 		margin-right: 17px;  
	}
	
	
 	
}