@media only screen and (min-width: 1200px) {
  	.container {
    	width: 1050px;
  	}
}


@media only screen and (min-width: 992px) {
	.side_bar, .logo-mobile, nav, .search_m{
		display: none;
	}
	#menu{
		display: none;
	}
	
	.slide{
		position: relative;
	}
	.con1{
		position: absolute;
	    left: 50%;
	    transform: translate(-50%, -50%);
	    padding-left: inherit;
	    padding-right: inherit;
	    top:3vw;
	    border-radius: 5rem;
	   	background-color: rgb(50 35 80);
		box-shadow: inset 0px 1px 1px 1px #55366a;
	}
	.wrapper{
		min-height: 100vh;
	}
	footer{
	    position: absolute;
	    left: 0;
	  	bottom: 0;
	    width: 100%;
	    color: white;
	    text-align: center;
	}
	.events {
	    min-height:calc(100vh - 60.9879032258vw);
	}
	.phone-table, .phone-dateBox{
		display: none;
	}
}

@media only screen and (max-width: 991px) {
	h1,h2,h3,h4,h5,h6 {
		line-height: normal;
	}
	.wrapper{
		background-image:none;	
	}
	header {
		padding: 29px 0;
		background-image:none;
		background-color: #002E6E;

	}
	header > .container {
		display: none;
	}
	header.index {
		position: fixed;
		top:0;
		display: flex;
		padding: 0;
		height: 58px;	
		background:#bd5049;
		background: -moz-linear-gradient(to bottom, #bd5049 0%, #670000 60%);
		background: -webkit-linear-gradient(to bottom, #bd5049 0%, #670000 60%);
		background: -o-linear-gradient(to bottom, #bd5049 0%, #670000 60%);
		background: -ms-linear-gradient(to bottom, #bd5049 0%, #670000 60%);
		background: linear-gradient(to bottom, #bd5049 0%, #670000 60%);
	}
	header.index.active {
		height: 100%;
		background-color:transparent;
	}
	html.mm-opened.mm-opening .mm-page .wrapper .index{
		left: 45%
	}
	/* Logo */
	header .logo-mobile{
		text-align: center;
		display: inline-block;
		position: absolute;
		top: 10px;
		left: 50%;
		margin-left:-90px;
	}
	header .logo-mobile img{
		max-width: 190px;
		width:80%;
	}
	
	/* Logo on the mobile's menu */
	.mobile-menu .logo {
		display:none;
	}
	
	/* mobile brands's menu 的小漢堡 */
	.mobile-menu-brand-btn{
		display:inline-block;
	}
	header .side_bar{
		font-size: 25px;
		color:#ffd89b;
		text-decoration: none;
	}
	header .search_m{
		text-decoration: none;
	}

	/* mobile brands's menu */
	#menu-brand {
		display:block;
	}
	#menu-brand .slideOUT {
		-webkit-transition:all 0.3s ease-out;
		-webkit-transform: translate3d(550px,0px,0px);
		transform: translate3d(550px,0px,0px);
	}
	
	
	.form-group input{
	  	width:120px;
	}

	.codeRight, .codeLeft{
		display:none;
	}
	.winlist{margin-top:58px;width: inherit; }
	.winlist ul li{
		color:#FFF;
	}
	footer{
	    position: absolute;
	    left: 0;
	  	bottom: 0;
	    width: 100%;
	    color: white;
	    text-align: center;
	}
	.events{
		min-height:calc(100vh - 56.5146316852vw);
		position: relative;
	}
	.events .container{
		margin-bottom:20px;
	}
	footer .container{
		margin-bottom:12vw;
	}
	.desktop-table{
		display: none;
	}

	.main-wrap{
        background-size: 163.2vw !important;/*612px*/
        padding-top: 9.0666666667vw;
    }
    #main {
		padding:13.8666666667vw 0 0;/*2.6rem 0 0*/
		width: inherit;
	}
	#main #luck {
		padding: 5.3333333333vw 3.2vw;/*20px 12px*/
		background: url(../image/frame_m.png) no-repeat center top;
		background-size: 100% 100%;
		width: 100vw;
		height: inherit;
	}
	#main #luck table {
		width: 100%;
		border-collapse: collapse;
	}
	#main #luck td {
		padding: 0.5333333333vw;/*2px*/
		width: 20%;
		border: none;
		text-align: center;
		vertical-align: top;
	}
	#main #luck td .item {
		padding-top: 1.0666666667vw;/*.2rem*/
		height: 13.3333333333vw;
		width: initial;
		color: #850d0d;
		font-size: 1.0666666667vw;/*.2rem*/
		box-sizing: border-box;
		
	}
	#main #luck .active .item {
	}
	#main #luck td .item img {
		margin: 0 auto;
		width: 6.4vw;/*24px*/
		height: initial;
		display: block;
	}
	#main #luck td .item span {
	    width: 13.3333333333vw;/*50px*/
	    display: block;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    white-space: nowrap;
	    margin: 0 auto;
	    font-size: 3.2vw;/*12px*/
	    margin-top: 1.0666666667vw;/*4px*/
	}
	#main #luck td .box {
		padding: 2.6666666667vw 3.2vw 0;/* 0.5rem 0.6rem 0*/
	}
	#main #luck td .box .img {
		position: relative;
		margin-bottom:inherit;
	}
	#main #luck td .box .img a {
		margin: 5.3333333333vw 0;/*20px 0*/
		display: block;
		left: inherit;
		bottom:inherit;
	}
    #main .phone-dateBox {
        text-align: center;
        margin:0 4px;
    }
    #main .phone-dateBox .date {
        height: 9.6vw;/*36px*/
        color: #342a45;
        font-size: 4.8vw;/*18px*/
        font-weight: bold;
        letter-spacing: -0.5px;
        line-height: 9.6vw;/*36px*/
        text-align: center;
        background: url(./image/time_bg.png) no-repeat center top;
        background-size: contain !important;
    }
	#main .phone-dateBox .date .text{
		width: 50%;
		float: left;
	}
    #main .phone-dateBox .date img {
        margin: -1.3333333333vw 0 0 0;/*-5px 0 0 0*/
        display: inline-block;
        vertical-align: middle;
		width: 4.8vw;/*18px*/
    }
    #main .phone-dateBox .date span {
        margin-right: 0.5333333333vw;/*2px*/
        color: #ca0000;
    }
    #main .phone-dateBox .date i {
        font-style: normal;
        display: inline-block;
        vertical-align:0.5333333333vw;/*2px*/
		font-size: 4vw;/*15px*/
        color:#fff;
		/* margin-right: 3.2vw;12px*/
    }
}

@media only screen and (max-width: 768px) {
	html, body {
		overflow-x:hidden;
	}
	.modal-dialog{
		width: 90%;
		margin:6vh auto;
	}

	#search .modal-content .modal-header, #account .modal-content .modal-header, #rank .modal-content .modal-header{
		height: inherit;
		background-size: cover;
	}
	
	.modal-content .modal-title{
		padding-left: 10px;
		margin:10px;
		font-size: .8rem
	}
	.events{
		min-height: calc(100vh - 53.101333vw);
	}
	
}
@media only screen and (max-width: 650px) {
	.events{
		min-height: calc(100vh - 64.101333vw);
	}
}


@media only screen and (max-width : 414px) { 
	.events{
		min-height:calc(100vh - 162.133333333333333vw);
	}
	footer .container{
		margin-bottom: 16vw
	}

	.form-inline .form-group{
		margin-bottom: 0;
	}
}

@media only screen and (max-width : 320px) { 
	.winlist{
		width: inherit;
	}
	.modal-dialog{
		width: 96%
	}
	.modal-body{
		padding:10px;
	}
	.table>tbody>tr>td, .table>thead>tr>th{
    	padding:4px;
    }
    .events{
		min-height:calc(100vh - 75.5vw);
	}

}