#container{ overflow-x:hidden;}

.display_pc{ display:block;}
.display_mo{ display:none;}

.anim{ opacity:0;}

.text-center{text-align:center;}
.text-right{text-align:right;}
.text-left{text-align:left;}

.pos_center{margin:0 auto;}

.box_over{position:absolute; width:100%;}

.pos_rel{position:relative;}
.pos{position:absolute;}


.font_pink{color:#e21b8f;}
.font_grey{ color:#333333;}


.aislive_bar{position:absolute; z-index:6; top:0%; right:0%;}
.ais_bar{ position:absolute; left:0%; top:0%; width:100%;}
.ais_logo {
    position: absolute;
    top: 33%;
    right: 14%;
	width:19%;
}



	.pos { position:absolute; }
	#ais_topupgame { width:100%; overflow-x:hidden; }
	#ais_topupgame_content { position:relative; margin:0 auto; width:1366px; height:1952px; }
	
	
	
	.box1_holder {position:relative; z-index:5;}
    .box1_content { position:relative; margin:0 auto; width:1366px; height: 729px; z-index:5; }
	
	
	
	


/*****************  box 1  ***************************/
/*.box1_holder{ position:relative; max-width:1366px; height:533px; background:url(../images/landing/box1_bg.jpg) no-repeat left top #a2d224; margin:0 auto;}
*/

.box1_box{ position:relative; float:right; text-align:right; margin-top:19%;}
.box1_box-h{ font-family: 'db_heaventbold_cond'; font-size:50px; line-height:50px; color:#000; text-align:right;}

.box1_box .box1_topupapp{ margin-right:-8%; margin-top:25px;}
.box1_box .box1_appstore{margin-top:25px;}

.box1_treasure {
    left: 37%;
    top: 70%;
}
.box1_shap{ left:0; top:0;}
.box1_tag{ left: -7%; top:0;}


.box1_tbl-row {
    display: table-row;
	
}

.box1_tbl-cell {
    display: table-cell;
	/*vertical-align:bottom;*/
   
}

/*****************  box 2  ***************************/
.box2_holder{ background:url(../images/landing/box2_bg.jpg) no-repeat center top; z-index:4; margin-top:-10.5%;}
.box2_content{position:relative; width:1366px; height:753px; margin:0 auto; margin:0 auto; z-index:4;}




/*****************  box 3  ***************************/
.box3_holder{ position:relative; width:100%; height:678px; background:url(../images/landing/box3_bg.jpg) no-repeat center top ;}
.box3_txt{ margin-top:75px; text-align:center;}

.box3_txt .h1{font-family: 'db_heaventbold_cond'; font-size:38px; line-height:50px;}
.box3_txt .h2{font-family: 'db_heaventbold_cond'; font-size:30px; line-height:40px;}
.box3_txt .h3{font-family: 'db_heaventmed_cond'; font-size:24px; line-height:30px;}

.box3_card{ position:relative; display:inline-block; margin:0 auto; width:100%; margin-top:45px;}
.card{ position:absolute; display:inline-block; float:left; padding:8px;  }
.card.card1{ width:252px; height:346px; left:37%; background:url(../images/landing/box3_1_bg.png) no-repeat center top; z-index:5; cursor:pointer;}
.card.card2{width:223px; height:326px; left:18%; background:url(../images/landing/box3_2_bg.png) no-repeat left top; margin-top:10px; z-index:4; cursor:pointer;}
.card.card3{width:223px; height:326px; left:60%; background:url(../images/landing/box3_3_bg.png) no-repeat right top; margin-top:10px; z-index:4;}
.card.card4{ width:195px; height:306px; left:0%; background:url(../images/landing/box3_4_bg.png) no-repeat left top; margin-top:20px; z-index:3;}
.card.card5{width:195px; height:306px; left:80%; background:url(../images/landing/box3_5_bg.png) no-repeat right top; margin-top:20px;  z-index:3;}

.border-left{ border-top-left-radius:5px; border-bottom-left-radius:5px;}
.border-right{border-top-right-radius:5px; border-bottom-right-radius:5px;}

.frame_border{  border:solid 2px #000; border-radius:5px;}

.obj_left{float:left;}
.obj_right{float:right;}

.card_holder {
    max-width: 1366px;
    height: 440px;
    margin: 0 auto;
    background: url(../images/ais_topupgame/obj_left.png) no-repeat left top -50px;
}
.card_inner{
	 max-width: 1366px;
    height: 440px;
    margin: 0 auto;
   background:url(../images/ais_topupgame/obj_right.png) no-repeat top right 90px;
   
 }

.card .title{text-align:center; color:#e21b8f; margin-top:15px; font-family: 'db_heaventmed_cond'; font-size:24px; line-height:30px;}
.card .desc{text-align:center; color:#000; margin-top:0px; font-family: 'db_heaventmed_cond'; font-size:20px; line-height:28px;}
.card .icon{ text-align:center; margin-top:26px;}

.bt_click{width:90px; height:35px; cursor:pointer; background:url(../images/ais_topupgame/bt_click.png) no-repeat center top; margin:0 auto; margin-top:15px;}
.bt_click:hover{width:90px; height:35px; background:url(../images/ais_topupgame/bt_click_hover.png) no-repeat center top;}

.card.card1:hover .bt_click{ background:url(../images/ais_topupgame/bt_click_hover.png) no-repeat center top; cursor:pointer;}
.card.card2:hover .bt_click{ background:url(../images/ais_topupgame/bt_click_hover.png) no-repeat center top; cursor:pointer;}

.box2_txt{font-family: 'db_heaventbold_cond'; font-size:20px; line-height:30px; color:#000;}

@media screen and (max-width:1400px) {
.box2_holder {margin-top: -14.5%;}
}

@media screen and (max-width:1366px) {
.box2_holder {margin-top: -14.5%;}
}

@media screen and (max-width:1280px) {
.box2_holder {margin-top: -15.5%;}
}

@media screen and (max-width:1040px) {
.box2_holder { margin-top: -19.5%;}

.display_pc{ display:none;}
.display_mo{ display:block;}	

.box2_mo{position:relative; margin-top:-7%; padding:20px;}
}

@media screen and (max-width:900px) {
	.box2_mo{position:relative; margin-top:-7%; padding:20px;}
}


@media screen and (max-width:640px) {
	
.display_pc{ display:none;}
.display_mo{ display:block;}	


.box2_mo{position:relative; margin-top:-34%; padding:20px;}
#pack_nonstop_content {
   /* height: 320px;*/
}

.box3_card {  margin-top: 15px;}

.box2_holder { position:relative; margin-top:0px;}





.box3_holder {  height: auto;}

.box3_txt .h1{font-size:30px; line-height:40px;}
.box3_txt .h2{ font-size:24px; line-height:30px;}
.box3_txt .h3{font-size:22px; line-height:30px;}
.card_holder,.card_inner{ max-width:1366px; height:auto;}
  
  .card{width:25%; position:relative; display:inline-block; float:left; }
  
  .card.card1,.card.card2,.card.card3,.card.card4,.card.card5{width:100%; position:relative; left:0%; float:left; background:none; border-radius:5px; margin-top:20px ;  height:300px; height: auto; }
  .card.card1{background-color:#a2d224; }
  .card.card2{background-color:#ffb41b; }
  .card.card3{background-color:#ffb41b;}
  .card.card4{background-color:#a2d224;}
  .card.card5{background-color:#a2d224;}
  
  
  .card.card1 .border{ padding:8px 5px; border:solid 4px #c5e47c; border-radius:5px;}
  .card.card2 .border{ padding:8px 5px; border:solid 4px #fbd082; border-radius:5px;}
  .card.card3 .border{ padding:8px 5px; border:solid 4px #fbd082; border-radius:5px;}
  .card.card4 .border{ padding:8px 5px; border:solid 4px #c5e47c; border-radius:5px;}
  .card.card5 .border{ padding:8px 5px; border:solid 4px #c5e47c; border-radius:5px;}
  
  .card.card1:hover .bt_click{ background:url(../images/ais_topupgame/bt_click_hover.png) no-repeat center top; cursor:pointer;}
 .card.card2:hover .bt_click{ background:url(../images/ais_topupgame/bt_click_hover.png) no-repeat center top; cursor:pointer;}
  
  .card_holder,.card_inner {
    height: auto;
	margin-bottom:40px;
	background:none;
/*	padding-bottom:300px;
  background: url(../images/ais_topupgame/obj_left.png) no-repeat left bottom, url(../images/ais_topupgame/obj_right.png) no-repeat bottom right;*/
    
}

}
@media screen and (max-width:480px) {
.box2_mo{margin-top:-83%;}	
	

#pack_nonstop_content {
    /*height: 250px;*/
}
.box2_content {
    height: 800px;
}
}

@media screen and (max-width:420px) {
.box2_mo{margin-top:-107%;}		

}

@media screen and (max-width:400px) {
.box2_mo{margin-top:-110%;}		


#pack_nonstop_content {
   /* height: 200px;*/
}
.box2_content {
    height: 800px;
}

}

@media screen and (max-width:380px) {
.box2_mo{margin-top:-130%;}	

}

@media screen and (max-width:360px) {
.box2_mo{margin-top:-140%;}	

}

@media screen and (max-width:340px) {
.box2_mo {
    margin-top: -150%;
}
}
@media screen and (max-width:330px) {
.box2_mo {
    margin-top: -160%;
}
}