/*______________________________________________________________________________________
  
                  CSS  Contenter
________________________________________________________________________________________*/

.wrapper{
    width: 100%;   
    background:url(../images/index_bg.jpg) no-repeat left top;
    background-color: #f0f1f0;
    -webkit-background-size:cover;
    -moz-background-size:cover;
    -ms-background-size:cover;
    position:relative;}

.container{   
    width: 95%;    
   /*  min-height: 100%; */
    margin:0 auto;    
    position: relative;
    z-index:5;    
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;      
    box-sizing: border-box;}


.btn_area{  
    margin:300px 0 5px 0;
    width: 100%;
    z-index:5; 
    position:relative;   
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;    
    box-sizing: border-box;   
   }

.event1_btn,.event2_btn{
    width: 49%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;    
    box-sizing: border-box;
        
}



.event1_btn{float:left;}
.event2_btn{float:right;}


a.event1,a.event2,{
    display:block;
    width: 100%;    
}   
    


a.coffee_btn{
    display:block;
    width: 100%; 
}



footer{
    margin:10px 0;
    /* position:absolute;
    bottom:0; */}




.coffee_container{
  width: 100%;
}


/* 手機
--------------------------------------------------------------------------------------*/
@media only screen and (min-width:421px){
    .container{min-height: auto;} 
    .wrapper{ 
        height:746px; 
        position:relative; 
        -webkit-background-size:contain;
        -moz-background-size:contain;
        -ms-background-size:contain;
        background-size:contain;  }
    
 }   

@media only screen and (max-width:360px){   
    }
  
  
@media only screen and (max-width:320px){ 
   
      
}