@charset "utf-8";

@media (min-width:1921px) {
	/*sidenav*/
	.menu {
		right: 1%;
		bottom: 11%;
		width: 9%;
	}
	.menu>img {
		margin-bottom: 4%;
		padding: 3%;
	}
	.menu__style {
		padding: 0%;
		border-radius: 0px;
	}
	.menu ul li {
		line-height: 2.4em;
		font-size: 0.9vw;
    }
}

@media (max-width:1920px) {
	/*sidenav*/
	.menu {
	right: 1%;
    bottom: 11%;
    width: 9%;
	}
	.menu>img {
		margin-bottom: -8%;
		/* padding: 3%; */
	}
	.menu__style {
		padding: 0%;
		/* padding: 8% 8% 10%; */
	}
	.menu ul li {
		line-height: 2.4em;
		font-size: 0.9vw;
    }
}

@media (max-width:1800px) {
	/*sidenav*/
	.menu {
		right: 1%;
		bottom: 11%;
		width: 9%;
	}
	.menu>img {
		margin-bottom: -6%;
		/* padding: 3%; */
	}
	.menu__style {
		padding: 0%;
		border-radius: 0px;
	}
	.menu ul li {
		/* line-height: 2.4em;
		font-size: 1vw; */
    }
	.eventBox {
    width: 90%;
	}
}

@media (max-width:1440px) {
    .eventBox {
        width: 97%;
    }
    .title, .title_promo {
        font-size: 2.8vw;
    }
    .eventDate {
        width: 95%;
        font-size: 1.4vw;
    }
    .eventCode {
        width: 95%;
        font-size: 1.4vw;
		line-height: 2vw;
    }
	.eventTxt, .eventBtn {
        font-size: 1.2vw;
    }
}




@media (max-width:1280px) {
/* @media screen and (max-width:1280px) */

    /*BankList*/
    .title, .title_promo {
        font-size: 2.8vw;
    }


    /*EventList*/
    .eventBox {
        width: 95%;
    }

    .eventTitle01 {
        font-size: 2.2vw;
    }

    .eventTitle02 {
        font-size: 1.8vw;
    }

    .eventTitle03,
    .eventTxt,
    .eventBtn,
    .property {
        font-size: 1.25vw;
    }

    .eventTxt .p-small {
        font-size: 0.9vw;
    }
	
	.eventBtn, .eventBtn02 {
    width: 25%;
	}

    /*shop*/
    .shopBoxTitle {
        font-size: 1.4vw;
    }

    .shopBoxBtn {
        font-size: 1.2vw;
    }


	/*sidenav*/
	.menu {
		right: 1%;
		bottom: 11%;
		width: 12%;
	}
	.menu>img {
		margin-bottom: -8%;
		/* padding: 3%; */
	}
	.menu ul li {
		line-height: 2.4em;
	}
	.animate-button.bg-seemore {
		font-size: 1.2vw;
		position: absolute;
		left: 20%;
		bottom: 10%;
	}
	/* sidenav 
	
		.menu {
		width: 15%;
		z-index: 999;
	}
	*/

	.menu__style {
		padding: 0%;
		border-radius: 0px;
	}
	.menu ul li {
		font-size: 1em;
		line-height: 2.1em;
	}
}


@media (max-width:1024px) {

    /* @media screen and (max-width:1024px) */

    .kv-wrap {
        margin-top: 75px;
    }

    /*BankList*/
    .bankBox ul {
        width: 80%;
        margin: 0 10%;
    }
    .bank {
        width: 32%;
    }

    /*EventList*/
    .eventBox {
        width: 100%;
    }
	
	.eventCode {
    line-height: 1.8vw;
	}
	.eventTxt p {
    font-size: 1.2vw;
	}
    /*sidenav*/
	.menu {
		right: 1%;
		bottom: 10%;
		width: 12%;
	}
	.menu>img {
		margin-bottom: 4%;
		padding: 3%;
	}
	.menu__style {
		padding: 6% 1% 10%;
		border-radius: 0px;
	}
	.menu ul li {
		line-height: 2.4em;
		font-size: 0.9vw;
	}
	.eventTxt ul li {
    margin: 1% 0 1% 4%;
    list-style-type: decimal;
    font-size: 0.9em;
    }
    .eventTxt .p-small {
        font-size: 0.9vw;
    }
	.animate-button.bg-seemore {
		font-size: 1.8vw;
		position: absolute;
		left: 20%;
		bottom: 10%;
	}

}




@media (max-width:768px) {
/* @media screen and (max-width:768px)  */
.eventTxt .p-small {
    font-size: 1.6vw;
}

	/* sidenav */
	.menu {
		width: 100%;
		bottom: 0;
		right: 0;
		
	}
	.menu>img {
		max-width: 23%;
		margin-bottom: -2.5%;
		padding: 0;
		opacity: 0.9;
	}
	.menu__style {
		padding: 0% 4% 0% 2%;
		border-radius: 0px;
	}
	.menu ul li {
		padding: 2px 21px;
		font-size: 1.2em;
		width: auto;
		border-bottom: 0px;
		/* padding: 2px 10px;
		font-size: 1.2em;
		line-height: 2.1em;*/
	}
	.menu ul li:hover {
		color: #000000;
	}
	
/* 收合導覽*/
	#sidebar .toggle-btn span {
    display: block;
   	width: 75px;
	height: 53px;
	line-height: normal;
	}
	
    .bank {
        width: 48%;
    }

    /*kv*/
    #kv,
    #kv_p {
        display: none;
    }

    #kv_m {
        display: block;
    }

    /*BankList*/
    .title, .title_promo {
        font-size: 4.4vw;
    }

    .bankBox ul {
        width: 97%;
        margin: 0 1.5%;
    }

    .btn_Favorite {
        width: 30%;
        position: absolute;
        top: 35%;
        left: 44%;
    }

    /**** 2025/2/19  promotion  ****/
    .promo {
        display: none;
    }

    .mpromo {
        display: block;
    }


    /*shop*/
    .shopArea ul {
        width: 100%;
        display: inline-table;
    }

    .shopArea ul li {
        padding: 2% 12%;
    }


    /*EventList*/
    .eventBox {
        width: 100%;
    }

    .eventTitle01 {
        font-size: 3.1vw;
    }

    .eventTitle02 {
        font-size: 2.7vw;
    }

    .eventTitle03,
    .eventTxt,
    .eventBtn,
    .property {
        font-size: 2vw;
    }
	/* .property2 {
        font-size: 2.2;
	} */
    .eventBtn {
        width: 28%;
    }
	.eventDate {
    width: 95%;
    font-size: 2.4vw;
    }
    
    .eventCode {
        width: 95%;
        font-size: 2.2vw;
        line-height: 2.7vw;
    }

    .eventTxt ul li {
        margin: 1% 0 1% 6%;
        font-size: 2vw;
    }

    /*popup*/
    .modal-content {
        width: 90%;
    }

    /*shop*/
    .shopBoxTitle {
        font-size: 2.8vw;
    }

    .shopBoxBtn {
        font-size: 2.4vw;
    }
	.toTop-arrow {
    bottom: 80px;
	}
}



@media (max-width:500px) {
    .eventTxt .p-small {
        font-size: 3vw;
    }
	
	/* #kv,
    #kv_p {
        display: none;
    }

    #kv_m {
        display: block;
    }
    */

    .btn_Favorite {
        width: 32%;
        top: 35.5%;
        left: 43.5%;
    }

    .title {
        font-size: 5.9vw;
    }
    

    .bankBox ul {
        width: 80%;
        margin: 0 10%;
        display: inline-table;
    }

    .bankBox ul li {
        margin: 1%;
        width: 47%;
    }
    .eventTitle01 {
        font-size: 5.2vw;
    }

    .eventTitle02 {
        font-size: 4.2vw;
    }

	 .eventTitle03, .eventTxt, .eventBtn, .property {
		font-size: 3.6vw;
    }
    
    .eventTxt ul li {
        font-size: 3.6vw;
    }
	
	.eventTxt p {
		font-size: 3.6vw;
	}
	
	.property2 {
    	font-size: 3.6vw;
	}
	.eventDate {
		width: 95%;
		font-size: 4.3vw;
    }
    .eventCode {
        font-size: 4.3vw;
        line-height: 6vw;
    }
	
	.eventBtn {
    width: 25%;
	}
	.eventBtn img {
    width: 19%;
    vertical-align: baseline;
    float: right;
   }

    /*EventList*/
    .eventBox {
        width: 100%;
    }

    .bank {
        width: 100%;
    }

    /*shop*/
    .shopBoxTitle {
        font-size: 4.4vw;
    }

    .shopBoxBtn {
        font-size: 3.2vw;
    }


    /*bn*/
    .moreArea ul {
        width: 100%;
        display: inline-table;
    }

    .moreArea ul li {
        padding: 2% 12%;
    }

    /*notice*/
    .note {
        font-size: 25px;
        padding: 15px;
    }
    /* sidenav */
	.menu {
		width: 100%;
		bottom: 0;
		right: 0;
	}
	.menu>img {
		max-width: 30%;
		margin-bottom: -4%;
		padding: 0;
	}
	.menu__style {
		padding: 10px 40px 10px 10px;
		border-radius: 0px;
	}
	.menu ul li {
	font-size: 3.2vw;
    line-height: 1.5em;
	padding: 2px 15px;
	}
	.menu ul li:hover {
    color: #202020;
	}
	.menu__style li:hover {
		color: rgb(32, 32, 32);
    }
	/* 收合導覽*/
	#sidebar .toggle-btn span {
    display: block;
   	width: 75px;
	hight: 80px;
	line-height: normal;
	}

}

 @media (max-width:499px) {
    .menu {
        width: 100%;
        bottom: 0;
        right: 0;
    }
    .menu>img {
        max-width: 30%;
        margin-bottom: -4%;
        padding: 0;
    }
    .menu__style {
        padding: 11px 5px;
        border-radius: 0px;
        font-size: 0.7em;
    }
    .menu ul li {
        line-height: 1.8em;
    }
    .menu ul li:hover {
        color: #202020;
    }
}

@media (max-width:400px) {

    /**/
    .kv-wrap {
        /*桌機模擬成功，但手機不顯示*/
        /*        background-position: 26% top;*/
        /*專門處理手機瀏覽器*/
        background-position: 43% top;
    }

    /*brand*/
}

@media (max-width:380px) {
    .menu>img{
        max-width: 30%;;
    }
    .menu__style{
        font-size:0.6em;
    }

    .discountText{
        padding: 0 3%;
    }
}


/*********************
RWD Directive Setting
**********************/

.no-padding-top {
    padding-top: 0;
}