/*------Mobile------ portrait*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 680px)
and (orientation : portrait){   

.customer_rewards_popup{ width:95% !important; margin-top: 0; min-width: 95vw; max-width: 95vw;}
.bg_popup1 .close{ width: 10%; left:auto; top:4vh !important; right:1vw;}
.bg_popup1 .close img{ width:35px;}
.customer_rewards_apply .title span:first-child { font-size: 30px !important;}
.customer_rewards_apply .title span:nth-child(2) {font-size: 13px !important; text-transform: none; }
.customer_rewards_apply .title span:nth-child(2) a{ font-size:11px;}
.customer_rewards_apply .title { margin-bottom: 2vh;}

.customer_rewards_popup span.btn{ width: 40%;}
	
.customer_rewards_popup .reward_bx{ height: 6vh; }	
.customer_rewards_popup .reward_bx_m { display:table;}
.customer_rewards_popup .reward_bx_d { display:none;}
.customer_rewards_apply .reward_bx div.text span.btn { width: 23vw;}

.customer_rewards_apply .reward_bx div.svg { font-size: 13px !important; width: 28vw; min-width: 28vw;}
.customer_rewards_apply .reward_bx div.txt { width: 58%;}
.customer_rewards_apply .reward_bx div.text span{ margin-bottom: 0; font-size: 11px !important; width:70%;}
.customer_rewards_apply .reward_bx div.text span.btn{ margin-top: 0.5vh;}
.customer_rewards_apply .reward_bx .img{ width: 20vw !important;}	
	.customer_rewards_apply .reward_bx div.text .img img {width: 9.5vh;}
.customer_rewards_popup .reward_bx div.text{ /*padding: 2% 5%;*/ padding: 2% 2%;}	
	

	
	.customer_rewards_popup span.btn {width: 80%;}
	.customer_rewards_popup .click {width: 90%;}
	.customer_rewards_popup .reserve_btn_d {display: none;}
	.customer_rewards_popup .reserve_btn_m {display: block;}	
	
	.customer_rewards_popup span.customer_name {margin-top: 3vh;}
	
p.line_h{ font-size:1.6vh;}	
	
	
img.pic_promo_popup { width: 93vw; top: 8vh;}
.bg_popup1 .close_red{ top: 12vh; width: 10%; left: 85%;}	
.bg_popup1 .close_red img { width: 6vh;}

.line_gab{ margin-top: 2vh; margin-bottom: 2vh;}

.invite_f_div{ font-size:1.8vh; width:80%; padding: 2% 3% !important;}
.invite_f_div p{ font-size:1.5vh;}
.invite_f_view{ padding: 2% 3% !important;}
.invite_f_view a{ padding: 1vh 1.5vh 0.7vh; font-size: 1.5vh;}
.invite_text_head .invite_text_i{ width:10%;}
.invite_text_head .invite_text_i .icon_rw { width: 3vh;}
.invite_text_head .invite_text_s{ font-size:1.9vh; width: 85%;}
.invite_text_sub{ font-size:1.2vh;}
.invite_text .invite_text_head{ margin-left:auto; margin-right:auto;}
.invite_link a.invite_link_btn{ font-size:1.7vh;}

.customer_rewards_popup .invite_f_tab .svg_inv{ padding-right: 1%; width: 16%;}
.customer_rewards_popup .invite_f_tab .svg_inv img{ width:9vw;}
.customer_rewards_popup .reward_bx { height: auto; padding: 5px 0; border-radius: 10px;}
.customer_rewards_popup .invite_f_tab .invite_f_div{ padding: 2% 0 !important; width: 54%; font-size: 11px;}
.customer_rewards_popup .invite_f_tab .invite_f_div p{ font-size: 10px; }
.customer_rewards_popup .invite_f_tab .invite_f_view a{ width: 19vw; font-size: 9.5px; padding: 1.2vh 0 1vh;}
.customer_rewards_apply .spc_rewards div.text span:first-child img{ margin-right: 0.5vw; width: 15px;}
.customer_rewards_popup .reward_bx div.text span:first-child{ /*font-size:2vh !important;*/ font-size:15px !important;}
.customer_rewards_popup .reward_bx div.text span:first-child a{ font-size:1.8vh !important;}
.customer_rewards_apply .reward_bx div.text span p.count{ font-size:1.6vh;}
.customer_rewards_apply .spc_rewards div.text span:first-child{ vertical-align:middle;}
.customer_rewards_apply .spc_rewards div.text span p { font-size: 1.6vh;}
	.customer_rewards_popup .reward_bx div.text span.not_avi { margin-top: 2.2vh; font-size: 14px !important; }	
	 
.customer_rewards_apply .reward_bx div.text span p {font-size: 11px;}	
.customer_rewards_apply .reward_bx div.text span a.del_sub {font-size: 1.2vh !important; font-family:avenirnext; text-transform: none; display: block;}		
	
	.bg_popup .cls{ margin-right: 0; z-index: 9999; position: absolute; right: 1vw;margin-top: 13vh;}
	.bg_popup .cls img { width: 6vh;}
	.bg_popup .customer_rewards_popup { margin-top: 15vh;}
	
	
	.msg_cv{ padding-bottom: 0; margin-bottom: 0;}
	.msg_cv .sub { font-size: 2vh; width: 93%; margin-left: auto; margin-right: auto; line-height: 120%;}
	.msg_cv .sub p{ font-size: 1.8vh; width: 100%; margin: 1vh auto;}	
	.msg_cv .time{ font-size: 16px; margin-top: 20px; padding-bottom: 2vh;}
	.msg_cv .time span.head{ width: 100%; white-space: none; font-size: 18px;}
	

	.customer_rewards_popup{ padding: 25px 0; height: auto;}
	.customer_rewards_popup span{ font-size: 30px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 85%; display: block; margin-left: auto; margin-right: auto; margin-bottom: 0;}	
	.customer_rewards_popup span.free{ font-size: 4.2vh;  white-space: normal; width: 100%;}
	.customer_rewards_popup span.free p{ font-size: 2.5vh !important;}
	.customer_rewards_popup span.btn{ width: 65%; font-size: 2.8vh;}
	
	.customer_rewards_popup .img_ns img.free_icon{ width: 7vh; margin-left: auto; margin-right: 23%; margin-top: 3vh; position: unset; display: block;}
	.customer_rewards_popup .img_ns img { width: 33vh; margin-top: -10vh;}
	.customer_rewards_apply{ height: auto;}
	
/*================== new 2021(covid) ===================*/	
	.customer_rewards_popup .covid p { font-size: 2.3vh;}
	.customer_rewards_popup .covid_tme{ font-size: 2vh;}
	.customer_rewards_popup .covid_tme span.head { font-size: 2.1vh; margin-top: 4vh;}
	.customer_rewards_popup span.btn_sub{ width: 50%; font-size: 2.5vh;}
	
	
	
	
	
	.customer_rewards_popup span.desc{ white-space: normal; font-size: 2.3vh;}

	
.bg_popup .nt_cls{ margin-top: 13vh; /*margin-top: 20vh;*/}
.customer_notice_popup {padding-bottom: 5vh; height: auto; width: 96% !important; padding: 0; /*margin-top: 23vh !important;*/}
	

	
	
	img.pic_notice {width: 8vh; opacity: 0.8;}	
	.main_notice { font-size: 2.5vh; margin-top: 1vh;}
	.main_notice2 { font-size: 2.5vh; margin-top: 1.5vh;}
	
	.sub_notice { font-size: 1.5vh;}
	.button_notice { font-size: 1.6vh;}
	
	
	
	
/*=========================*/	
	
	.customer_rewards_popup .appdl_container_head .appdl_container_head_pic {width: 25%;}	
	.customer_rewards_popup .appdl_container_head .appdl_container_head_content img	{width: 95%; vertical-align: middle; padding-left: 3%; }
	
	.customer_rewards_popup .appdl_container {border: 3px solid #000;}
	
	.customer_rewards_popup .appdl_container .appdl_container_content .appdl_container_content_box .appdl_container_content_box_store p {font-size: 1.7vh;}
	.customer_rewards_popup .appdl_container .appdl_container_content .appdl_container_content_box .appdl_container_content_box_store p.store {font-size: 3.5vh;}
	
	
	
/*	========= detect landscape ========*/
	
	ul.detect_landscape_ul li{ height: auto !important;}
	
	
	
	
	
	
	
}



/* iPhone X and Xs Max */
/*@media only screen 
and (min-device-width: 375px) 
and (min-device-height: 812px) 
and (-webkit-device-pixel-ratio: 3)
and (orientation: portrait) { 
    
.bg_popup1 .close{ width: 10%; left:auto; top:5vh; right:2vw;}
.bg_popup1 .close img { width: 6vh;}
.customer_rewards_popup span{font-size: 3.8vh;}	
.customer_rewards_popup span.free{ font-size: 3.8vh;}
.customer_rewards_popup span.btn{ font-size: 2.8vh;}	
.customer_rewards_popup span.btn { width: 65%;}
.customer_rewards_popup .click{ margin-top: 6vh; font-size: 1.8vh; width: 80%;}
	

.customer_rewards_popup { width: 95%;}	
.customer_rewards_apply .title span:nth-child(2){ font-size:1.5vh !important;}
.customer_rewards_apply .reward_bx div.text span.btn { width: 30vw;}
	
	
	
}*/



/* iPhone 11 */
/*@media only screen 
    and (device-width: 414px) 
    and (device-height: 896px) 
    and (-webkit-device-pixel-ratio: 3) { 
	
	
.bg_popup1 .close{ top: 4.5vh !important; left: 100% !important;}
.customer_rewards_popup span{font-size: 3.8vh;}	
.customer_rewards_popup span.free{ font-size: 3.8vh;}
.customer_rewards_popup span.btn{ font-size: 2.8vh;}	
.customer_rewards_popup span.btn { width: 50%;}
.customer_rewards_popup .click{ margin-top: 6vh; font-size: 1.8vh; width: 70%;}
	

.customer_rewards_popup { width: 95%; padding:2vh 0 2vh;}
.customer_rewards_apply .reward_bx div.text span.btn { width: 27vw;}

	
	
}*/







/*------Ipad------ portrait*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (orientation : portrait){
	
.customer_rewards_popup{ width:85%; margin-top: 10%;}
.bg_popup1 .close{ top: 8.5vh; left: 58% !important;}

.customer_rewards_apply .reward_bx div.text span.btn{ padding: 1.25vh 3vw 1vh;}	
.customer_rewards_apply .reward_bx div.text span{ margin-bottom: 0;}
.customer_rewards_apply .title span:nth-child(2){ font-size: 1.9vh;}

.customer_rewards_popup span{ font-size: 3.8vh;}
.customer_rewards_popup span.btn{ width: 38%;}
.customer_rewards_popup .click{ padding: 3vh 0 2.3vh; font-size: 1.8vh;}
.customer_rewards_popup .click span{ font-size: 1.8vh;}	
.customer_rewards_apply .title span:first-child{ width: 80%;}
.customer_rewards_apply .reward_bx .img{ width:4vw;}
.customer_rewards_apply .reward_bx div.txt { width: 58%;}
	

img.pic_promo_popup{ width:90vw;}
.bg_popup1 .close_red { top: 11.5vh; left: 89vw !important; width: 10%;}
.bg_popup1 .close_red img{ width:7.5vh !important;}

.invite_text_head .invite_text_s{ font-size: 2.8vh;}
.invite_text_sub{ font-size:1.7vh;}


.customer_rewards_popup .invite_f_tab .svg_inv{ width:16%; padding-right:1%;}
.customer_rewards_popup .invite_f_tab .svg_inv img{ width:8vw;}
.customer_rewards_popup .invite_f_tab .invite_f_view a{ width: 20vw;}

	.bg_popup .cls{ margin-right: 4%;}
	
	
	
	.customer_rewards_popup .img_ns img.free_icon{    margin-left: 37vw;}
	
	
	
	.customer_rewards_popup .covid p { font-size: 3.2vh;}
	.customer_rewards_popup .covid_tme span.head { font-size: 3vh;}
	.customer_rewards_popup .covid_tme{ font-size: 2.8vh;}
	.menu_navbar div img{ width: 40vh;}
	
	
	
	
	
}




/*------Ipad------ landscape*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (orientation : landscape){

.customer_rewards_popup{ width:45%; margin-top: 3%;/* height: 78vh;*/}
.bg_popup1 .close{ top: 2vh; left: 43%;}

.customer_rewards_apply .title span:nth-child(2) { font-size: 1.8vh;}
.customer_rewards_popup .reward_bx{ height: 6.5vh;}
.customer_rewards_popup span.btn{ width: 40%;}
.customer_rewards_apply .reward_bx div.svg{ width: 40%; font-size: 1.7vh;}
.customer_rewards_apply .reward_bx div.text span{ margin-bottom: 0; margin-top: 0.6vh;}
.customer_rewards_apply .reward_bx div.text span.btn{ width: auto; padding: 1.25vh 2vw 1vh; margin-top: 1.2vh; margin-bottom: 0.6vh;}
.customer_rewards_popup .click{ width: 85%;}

img.pic_promo_popup { width: 50vw;}
.bg_popup1 .close_red{ top: 12vh !important; left: 48% !important; z-index: 99;}
.bg_popup1 .close_red img { width: 7.5vh;}

.invite_text_head .invite_text_s{ font-size: 2.5vh;}
.invite_text_sub { font-size: 1.55vh;}

.customer_rewards_popup .invite_f_tab .svg_inv{     padding-right: 1%; width: 13%;}
.customer_rewards_popup .invite_f_tab .invite_f_view a{ width: 11vw;}
.customer_rewards_popup .invite_f_tab .invite_f_div{ font-size:1.8vh;}
.customer_rewards_popup .invite_f_tab .invite_f_div p{ font-size:1.8vh;}
.customer_rewards_popup .invite_f_tab .svg_inv img { width: 3.8vw;}
.customer_rewards_apply .title span:nth-child(2) a { font-size: 1.5vh;}
.customer_rewards_apply .reward_bx div.text span p.count{ padding: 0.7vh 1vh 0.3vh;}

.customer_rewards_apply .reward_bx div.txt {
    width: 54%;
}	
	
	.bg_popup .close{ margin-right: 25%;}

	
	
	.customer_rewards_popup .covid p{ font-size: 3vh;}
	.customer_rewards_popup .covid_tme span.head { font-size: 2.8vh;}
	.customer_rewards_popup .covid_tme{ font-size: 2.6vh;}
	
	
	
	
	
}



/*------tablet------ portrait*/
@media only screen 
and (max-device-width: 960px) 
and (min-device-width: 401px) 
and (orientation: portrait){
	
.bg_popup1 .close{ width: 10%; left:auto; top:5vh; right:3vw; margin-right:0;}
.bg_popup1 .close img { width: 7vh;}
	
}