/**思源宋體**/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@600&display=swap');


body {
	font-family: "微軟宋體","微軟正黑體", "Microsoft JhengHei", Helvetica, Arial, sans-serif;
	height: 100%;
	width: 100%;
}


.bg__theme {
	background-color:#b6b6b6 ; /*#FFC48C #F4D940; */
}
.bg__theme2{
	background-color: #333;
}
.bg__theme__yel{
	background-color: #fcfd71;
}
.bg__theme__loveYouself{
	background-color: #eed9d9;
}
.bg_newin{
	background-color: #39708b;
}
.bg__loveMen, .bg__loveDaddy{
	background-color: #050b0c;
}
.bg-pink {
	background-color: #ffb3b3;
}

.bg-white {
	background-color: #ffffff;
}
.bg-Blue {
	background-color: #2b8fc1;
}
.bg-lightBlue {	
	background-color: #9fd1f2;
}
.bg-yellow {
	background-color: #ffe100;
}

.bg-fuchsia {
	background-color: #EB3E80;
}
.btn-theme{
	background-color: #606060 !important; /* #FF9291 */
	color: #ffffff !important; /* E62949 */
}
.btn-theme2{
	background-color: #b8251c;
	color: #eee;
}

.btn-yellow{
	background-color: #006d5a !important;
    color: #fff !important;
    border: 2px #006d5a solid;
	padding: 2px;
}
.btn-yellow:hover{
	background-color: #9fd8cd !important;
	color: #006d5a !important;
	border: 2px #006d5a solid;
}

.btn-red{
	background-color: #ffe33a !important;
    color: #000 !important;
    border: 2px #000 solid;
	border-radius: 22px;
	box-shadow: #000 3px 3px 0px;
	font-weight: 600;
	font-size: large;
}
.btn-red:hover{
	background-color: #ffe33a !important;
	color: #333 !important;
	border: 2px #333 solid;
	box-shadow: transparent 3px 3px 0px;
}

.btn-pink{
	background-color: #d60f08 !important;
	border: 2px #d60f08 solid;
    color: #ffffff!important;
    border-radius: 0px;
    /* box-shadow: #000 3px 3px 0px; */
    font-weight: 600;
	font-size: large;
	border-radius: 4px;
}

.btn-pink:hover{
	background-color: #0d856c !important;
	border: 2px #118775 solid;
	box-shadow: transparent 3px 3px 0px;
}

.btn-LINE{
	background-color: transparent !important;
    color: transparent!important;
    font-size: large;
}

.btn-red-info{
	padding: 4% 2%;
	background-color: transparent !important;
	color:#fff !important;
	border: 2px #ffffff solid;
	font-size: large;
	border-radius: 4px;
	text-decoration: none;
}
.btn-red-info:hover{
	background-color: rgba(213,21,16, 0.7) !important;
	text-decoration: none;
	font-style: italic;
}

.btn-white-info{
	padding: 4% 2%;
	background-color: transparent !important;
	color: #005447 !important;
	border: 0px #fff solid;
	font-size: larger;
}
.btn-white-info:hover{
	border: 0px #fff solid;
	/* text-decoration: none; */
}
.info-text {
	text-decoration: none;
	/* font-size: large; */
	font-style: normal;
}
.info-text:hover {
	text-decoration: none;
	font-style: italic;
}

.btn-pink2{
	background-color: #fe3c93!important;
	border: 2px #fe3c93 solid;
    color: #fff!important;
    border-radius: 0px;
    /* box-shadow: #000 3px 3px 0px; */
    font-weight: 600;
    font-size: large;
}

.btn-pink2:hover{
	background-color: #8a2dfe !important;
	color: #fdff08 !important;
	border: 2px #8a2dfe solid;
}

.btn-pink2-info{
	padding: 4% 2%;
	background-color: transparent !important;
	color: #fe3c93 !important;
	border: 2px #fe3c93 solid;
	font-size: large
}
.btn-pink2-info:hover{
	color: #8a2dfe !important;
	border: 2px #8a2dfe solid;
}


.btn-peach{
	background-color: #f148a9 !important;
	color: white !important;
	border: 2px #f148a9 solid;
}
.btn-peach:hover{
	background-color: transparent !important;
	color: #f148a9 !important;
	border: 2px #f148a9 solid;
}

.btn-darkblue:hover{
	background-color: #ff5db6 !important;
	/* filter: invert(1); */
}


.btn-more{
	background-color: #e6c804 !important;
	color: black !important;
	padding: 8px 6px;
}
.btn-more:hover{
	background-color: #b8251c !important;
	filter: invert(1);
}

/*font color*/
.text_color_none {
	color: transparent;
}
.text_EBX_red {
	color:#c51e43;
}
.text_EBX_purple {
	color:#4b306e;
}
.dark_purple {
color: #3c2e7e;
}
.dark_purple2 {
	color: #453594;
}

.text_black {
	color: #000000;
}
.text_brown {
	color: #965511;
}
.text_gray {
	color: #555555;
}
.text_white {
	color: #fff;
}
.text_light_grey {
	color: rgb(238, 235, 235);
}
.text_pink{
	color:#f9819d;  /*  #fe3c93   */
}

.text_purple{
    color: #067e65;
    border: 1px #067e65 dashed;
    margin: 1% 0%;
    padding: 0.5% 0%;
    font-weight: 600;
}

.text_blue{
	color: #2c8fc2;
}

.text_yellow_lite {
	color: #ffef5c;
	font-weight: bold;
}
.text_green{
	color: #006b5a;
}

.text_red{
	font-size: 1.4vw;
	color: #d1342d;
}
.text_darkred{
	color: #920117;
}

.text_snack_info{
	color: #2c2b15;
}

.discountBox_title__color{
	color:#c1251a;
}
.text_yellow{
	color: #ce130f;
}
.discountBox__title__color2{
	color:#f16081; /*#D7393F;*/
}
.text_title {
	color: #a5ebf7;
}
.text_info2 {
	color: #ffffffeb;
	/* font-weight: 600; */
}
.text_info {
	color: #ffffff;
}

.text_darkO {
	color: #463c37;
}
.text_khaki {
	color: #a2877b;
}
.text_price_red{
	color: #F34D6D;
}
.text_fuchsia {
	color: #ff5991; /*#EB3E80; */
	font-weight: 600;
}
.text_bold {
	font-weight: 600;
}
.text-center {
	text-align: center;
}
.text-left{
	text-align: left;
}
.price-before {
	text-decoration: line-through;
	color:#9E8D8D;
}
.two__two__box__price{
	color: #F34D6D;
	font-weight: 600;
	line-height: 1.2rem;
	font-size: 1.2rem;
	/* line-height: 1rem; */
}
/*font size*/

.f1 {
	font-size: 4vw;
}
.f2 {
	font-size: 3vw;
}
.f3-1 {
	font-size: 2vw;
	font-weight: bold;
	/* font-family: 'Noto Serif TC';  思源宋體*/
	margin-top: 2%;
}

.f3 {
	font-size: 1.8vw;
	font-weight: bold;
	/* font-family: 'Noto Serif TC';  思源宋體*/
}
.f3_b {
	font-size: 1.9vw;
}
.f3_r {
	font-size: 2vw;
	font-weight: bold;
	/* filter: drop-shadow(0px 0px 3px #ff425a); */
	line-height: normal;
}
.f4 {
	font-size: 1.2vw;
}
.f5 {
	font-size: 1vw;
	line-height: normal;
}
.f5_r {
	font-size: 1.3vw;
	font-weight: bold;
	line-height: normal;
}
.f6 {
	font-size: 0.9vw;
}
.f6_r {
	font-size: 1vw;
	font-weight: bold;
	letter-spacing: 1px;
}
.f6_g {
	font-size: 1.1vw;
	font-weight: bold;
	letter-spacing: 1px;
	line-height: normal;
}
.f7 {
	font-size: 0.8vw;
}

.btn-wrapper-dis2 {
    margin: 4% 10% 1%;
	display: block;
}

.btn-wrapper-dis {
	display: inline-block;
	width: 40%;
}

.btn-wrapper-every {
	display: inline-block;
	width: 52%;
	margin-top: 20%;
	font-size: larger;
	text-align: center;
}


.btn-wrapper-dis:nth-child(1) {
	margin: 3% 4% 1% 0%;
}
.btn-wrapper-dis:nth-child(2) {
	margin: 3% 0% 1% 0%;
}

.discount-bird {
    position: absolute;
    z-index: 2;
    right: 0%;
    top: -3%;
}
.discountBox_default .discount-bird img{
    width: 100%;
}

.btn-wrapper {
	width: 38%;
    margin: 4% 2% 1%;
	display: inline-block;
}
.w42 {
	width: 42%;
	margin-right: 2%;
}
.w36 {
	width: 36%;
}


.btn-wrapper-more {
	width: 100%;  
	margin: 0% auto 0%; 
}
.btn-wrapper-gift {
    width: 60%;
	margin: 0% 20% 0%;
    z-index: 4;
}

.btn-main {
	padding: 5% 5%;
    font-weight: 600;
}
.btn-text-right {
    text-align: right;
}
.btn-text-left {
    text-align: left;
}
.btn-text-center {
    text-align: center;
}

.btn-main-inline {
    display: inline;
    padding: 1% 4%;
	text-align: center;
}
.btn-purple {
    background-color: #7a6dbf !important;
    color: white !important;
    border: 2px #ffffff solid;
	border-radius: 20px;
}

.btn-inline {
    display: inline;
	margin: 0% 0% 0% 24%;
}

.btninfo-c {
    /* line-height: 2em; */
    padding: 5% 2%;
    text-align: center;
    font-weight: 600;
    color: #333333;
    text-decoration: none;
}

.btninfo-c:hover {
    color: #000000;
    text-decoration: none;
}

.btn4 {
    padding: 0 7%;
    text-align: center;
}

.moreBtn1 {
    width: 16%;
	font-size: 1vw;
	font-weight: bold;
    color: #ab011b;
    background-color: #fff1c9;
    border: 2px solid #fff1c9;
    padding: 8px 4px;
    margin: 0% 42% 1%;
}
.moreBtn1:hover {
    color: #fff1c9;
    background-color:transparent;
    border: 2px solid #fff1c9;
}

.moreBtn {
    width: 16%;
	font-size: 1vw;
	font-weight: bold;
    color: #ffffff;
    background-color: #ab011b;
    border: 2px solid #ab011b;
    padding: 8px 4px;
    margin: 0% 42% 1%;
}
.moreBtn:hover {
    color: #ab011b;
    background-color:#fff1c9;
    border: 2px solid #ab011b;
}

.btn-B5wrapper {
	width: 40%; 
	margin: 0% auto;  
	position: relative;
	/* margin: 10px auto; */
}


.btninfo_y {
    /* line-height: 2em; */
    padding: 5% 2%;
    text-align: center;
    font-weight: 600;
    color: #fcde96;
    text-decoration: underline;
}

.btninfo_y:hover {
    color: #fff;
    text-decoration: none;
}


.btninfo {
    /* line-height: 2em; */
    padding: 5% 2%;
    text-align: center;
    font-weight: 600;
    color: #333333;
}

.btninfo:hover {
    color: #000000;
    text-decoration: none;
}
.underline {
	text-decoration: underline;
}

.btn-info {
    color: #c1251a;
    text-decoration: underline;
    padding: 2%;
    display: block;
    text-align: center;
	margin: 1%;
	letter-spacing: 0.05vw;
}
.btn-info:hover{
	color: #f06b6b;
}

.btn__flowergift__info {
    color: #c1251a;
    text-decoration: underline;
    /* padding: 2%; */
    display: block;
    text-align: center;
	/* margin: 1%; */
	letter-spacing: 0.05vw;
}
.btn__flowergift__info:hover {
    color: #ff7171;
}

.mg-b{
	margin-bottom: 3%;
}

.mg-top {
	margin-bottom: 2%;
}

.mg-bottom {
	margin-bottom: 2%;
}


/* discount   */
.giftBox_area {
	width: 100%;
	margin: 0%;
	padding: 0%;
	text-align: center;
}
.giftBox_areaL2 {
	width: 100%;
	margin: 0%;
	padding: 0%;
}
/* main-type-1 */

.main-type-1 hr {
    margin: 5px auto 15px;
} 
.main-type-2 hr {
	margin: 5px auto 15px 50%;
}
hr.title-hr {
    width: 20%;
    height: 1px;
}

hr.title-hr-row2 {
    width: 80%;
    height: 1px;
}

.content-text {
	font-size: 1.3vw;
	font-weight: bold;
	line-height: normal;
}


/* 免運區  */
.coupon_area {
    /* background-image: url(../images/stars.png); */
    background: linear-gradient(to bottom, #eae0ff 5%, #fdfcff 100%);
    padding-top: 3%;
}
.coupon_L{
	margin-left: 131px;	
}




.coupon_box {
	display: inline-block;
    text-align: center;
    margin: 0%;
    width: 41.4%;
	border: 1px #888 solid;
}
.coupon_date{
	color: #722e94;
    font-weight: 600;
    font-size: 22px;
    margin: 40px auto 20px auto;
}
.coupon_title{
	font-weight: bold;
    font-size: 30px;
    margin-bottom: 15px;
}
.coupon_text{
	color: #666666;
    font-size: 20px;
    margin-bottom: 10px;
}
.game_gift {
    color: #cc0000;
    font-size: 20px;
    line-height: 25px;
    padding-bottom: 350px;
}
.coupon_info{
	margin: -15px auto 40px auto;
    display: block;
}
/*轉盤*/
.roulette_box {
	margin: -71% 59% auto 0%;
    /* margin: 62% auto auto -58%; */
}
.game_inner {
    position: absolute;
	z-index: 1;
	width: 51.9%;
    /* width: 52%;
	margin: -22.5% auto auto 0.5%;
	width: 50%; */
	/* margin: 4% 24%; */
	margin: 3.8% 24%;
}
.game_pointer {
    position: absolute;
    z-index: 2;
    width: 59.2%;
    margin: 0% 20.4%;
    /* margin: -23% auto auto auto; */
}
.game_bt {
    position: absolute;
    z-index: 3;
    width: 6%;
    margin: -14.5% auto auto 8.5%;
}
.game_btn {
    position: absolute;
    z-index: 3;
	width: 19.6%;
	margin: 20% 40.1%;
}

.game_FS {
    width: 100%;
    margin-bottom: 15px;
}
.dis_text {
	position: absolute;
	z-index: 2;
	text-align: left;
}

.dis_margin1 {
	margin: 21% 0% 0% 10%;
	width: 86%;
}
.dis_margin2 {
	margin: 17% 0% 0% 20%;
	width: 76%;
}

.dis_text a {
	color:#006b5a;
	text-decoration: underline;
}
.dis_text a:hover {
	color:#d1342d;
	font-style: italic;
	text-decoration: underline;
}

.content-text1 {
	font-size: 1.4vw;
	font-weight: 400;
	line-height: normal;
	font-family: Arial, Helvetica, sans-serif;
}

.content-text1 b {
	font-weight: 600;
}
.dis_info {
	position: absolute;
	z-index: 3;
    margin: 48% 3% 0% 3%;
    width: 94%;
}

.dis_infoEveryday {
    position: absolute;
    z-index: 5;
    margin: -2% 5% 0% 32%;
    width: 24%;
}

.game_info {
	position: absolute;
    z-index: 4;
    width: 98%;
	margin: -12% 0% 0%;
	color:#fff;
}

.gift_info {
    position: absolute;
    z-index: 4;
    width: 100%;
	margin: -19% 0% 0% 2%;
}

.skincare-box-wrap p{
	font-size: large;
	color: #281654;
    font-weight: normal;
    padding-top: 0.5%;
    line-height: normal;
}
/* coupon-500 500購物金 */

.oneContainerArea {
	display: flex;
	position: relative;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	/* background-image: ; */
	background-color: #FFCC24;
}
.oneContainerBox-title {
	color: #EB3E80;
	/* font-family: 'Noto Serif TC', serif, Helvetica, Arial; */
	margin-top: 3%;
}
.img-dot-bg {
	position: absolute;
	width: 11%;
	/* height: 20%; */
	z-index: 2;
}
.img-dot-bg-r {
	right: 0px;
	top: 0;
}
.img-dot-bg-l {
	left: 0px;
	bottom: 0;
}
.oneContainerBox {
	/* display: inline-block; */
	/* padding: 3%;
    margin: 4%;
    width: 70%; */
	background-color: #fcf1c3;
	text-align: center;
}
.img-coupon {
	max-width: 50%;
	/* width: 100%; */
	height: auto;
	margin-bottom: 2%;
}
.coupon-text-title {
	color: white;
	background-color: #EB3E80;
	text-align: center;
	padding: 1% 2%;
	/* width: 200px; */
	border-radius: 12px;
}
/* .coupon-text-title::after{
    content:"折扣碼【618BUY】";
    background-color: #EB3E80;
    padding: 1%;
} */

.coupon-text-info {
	color: #EB3E80;
	margin: 3%;
	line-height: 1.3em;
	font-size: 1.4rem;
}
.event_wrap {
	width: 100%;
	/* height: 100%; */
	/*font-family: futura-pt, Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei";*/
}
.mar_0{
	margin: 0% 0% -0.5%;
	padding: 0%;
    /* background-color: #f2f2f2; */
}
.top_bor {
	width: 75%;
	border-top: 1px #fff dashed;
}
a {
	color: #5d656c;
	text-decoration: none;
}
.wish_wrapper img{
    width: 100%;
}
/*kv*/

.kv_wrapper {
	width: 100%;
}
.kv, .gift-BN {
    display: block;
    width: 100%;
}
.mkv, .mgift-BN {
	display: none;
}

/*  PC / Mobile */
.pc_area {
	display: block;
}
.mob_area {
	display: none;
}



.Anniversary {
	color: transparent;
	text-align: center;
	margin: 4vw;
	position: absolute;
	top: 25%;
	right:40%;
}
/* 邊框動畫效果 */

.animate-button {
	display: inline-table;
	position: relative;
	/* border: 1px solid #c1251a;  */
	/* background-color: #eee; */
	padding: 7px 5px;
	margin: 4% 0.5%;
	text-align: center;
	/* color: #c1251a;  */
	transition: 1s;
}

/* .animate-button {
	display: inline-table;
	position: relative;
	border: 1px solid #c1251a;
	background-color: #eee;
	padding: 7px 5px;
	margin: 4% 0.5%;
	text-align: center;
	color: #c1251a;
	transition: 1s;
} */

.animate-button.text-black {
	color: black !important;
}
.animate-button.bg-shopnow {
	background-color: #ffc440;
	/* ff768b */
}
.animate-button:hover {
	background-color:#e5e646 !important; /* #242a9cf0*/
	color: #b8251c !important; /* #ffffffe3 */
}
.animate-button.bg-seemore {
	background-color: #020100;
	/* ff768b */
	color: white;
	position: absolute;
	/* right: 28%; */
	bottom: 5%;
}
.animate-button::before {
	content: "";
	width: 0%;
	height: 0%;
	position: absolute;
	bottom: -1px;
	right: -1px;
	transition: 1s;
}
.animate-button:hover::before {
	width: 100%;
	height: 100%;
	border-bottom: 2px solid black; /* eb3e80 */
	/* ffc440 */
	border-right: 2px solid black; /* eb3e80 */
}
.animate-button::after {
	content: "";
	width: 0;
	height: 0;
	position: absolute;
	top: -1px;
	left: -1px;
	transition: 1s;
	/* -webkit-transition: border .2s linear, border-radius 1s ease-in 1s;
    transition: border .2s linear, border-radius 1s ease-in 1s;*/
}
.animate-button:hover::after {
	width: 100%;
	height: 100%;
	border-top: 1px solid black; /* eb3e80 */
	/* ffc440 */
	border-left: 1px solid black; /* eb3e80 */
}
/*   邊框動畫效果  END */


.popup-button{
	padding: 1px 10px !important;
}


/* 台新卡友日 */

/*TS frame*/

.kv_wrapper {
	width: 100%;
}
.TS {
	display: block;
}
.mTS {
	display: none;
}

.Card {
	display: block;
}
.mCard {
	display: none;
}

.uber-logo {
	color: #ffffff;
	background-color: #111111;
	padding: 2px 8px;
}

.event-box-wrap-TS {
    position: relative;
    text-align: center;
    padding-top: 0%;
    padding-bottom: 0%;
}


/*discount*/
.event-box-wrap-row1 {
    position: relative;
	text-align: center;
	/* height: 460px; */
	padding-top: 2%;
	padding-bottom: 0%;
}
.event-box-wrap-row3 {
	position: relative;
	width: 100%;
	margin: 0%;
	padding: 0%;
	background-color: #f2f2f2;
}

.discountArea {
	position: relative;
	width: 100%;
	margin: 0% auto;
	/* margin-bottom: 3.5% !important; */
	display: flex;
	align-items: center;
	justify-content: center;
	/* flex-wrap: wrap; */
	/* background: linear-gradient(to top, #16203b 0%, #16203bc7 40%, #16203b00 100%); */
 /*-25% */
	padding-bottom: 1.5%;
}
.mg-top{
	margin-top: -11%; 
}
.Gift4H {
	width: 80%;
    margin: 0 auto;
    padding-bottom: 2%;
}

/* EBX贈品  */
.GameBox {
	width: 75%;
    margin: 1% auto 0%;
    padding-bottom: 2%;
	/*text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	box-sizing: border-box;
	padding-top: 0%;
	z-index: 1;
	background-image: url("../images/gift-white.png") center bottom no-repeat;
	*/
}

.white-bk {
	background-image: url(../images/gift-white.png) no-repeat;
	background-position: bottom right;
	/* background-color: rgba(255, 255, 255, .40); */
}


.main-box-bk {
    /* background-image: url(../images/discountBox_bk.png); */
	text-align: center;
    width: 100%;  /* width: 86.9%; */
    height: auto;
    margin: 0%;
    padding: 4% 0% 0%;
    border: 0px #fff solid;
    /* position: absolute;
    z-index: 1; */
}

.main-box-bk img{
	text-align: center;
}

.main-box-bk_row2 {
	/* background-image: url(../images/discountBox_bk.png); */
	width: 100%;
    text-align: center;
    height: auto;
    margin: 0%;
    padding: 4% 0%;
    border: 0px #fff solid;
    position: absolute;
    z-index: 3;
    /* top: -10px; */
	right: 0%;
	list-style-type: none;
}
.main-box-bk_row2-2 {
    width: 55%;
    text-align: left;
    height: auto;
    padding: 4% 0%;
    border: 0px #fff solid;
    position: absolute;
    z-index: 3;
	left: 40%;
	list-style-type: none;
}
ul.main-box-bk_row2-2 li{
	margin: 3% auto;
}

.main-box-bk_gift {
    width: 55%;
    text-align: left;
    height: auto;
    padding: 4% 0%;
    border: 0px #fff solid;
    position: absolute;
    z-index: 3;
	left: 5%;
	list-style-type: none;
}
ul.main-box-bk_gift li{
	margin: 3% auto;
}

.discountBox__icon {
    max-width: 26%;
    position: absolute;
    right: 1%;
	top: 6%;
	-webkit-animation: floating-icon 2s ease-in-out infinite;
    -moz-animation: floating-icon 2s ease-in-out infinite;
    animation: floating-icon 2s ease-in-out infinite;
}

/*discount ROW2*/
.discountArea_row2 {
	position: relative;
	width: 100%;
	/* margin-bottom: 3.5% !important; */
	display: flex;
	align-items: center;
	justify-content: center;
	/* flex-wrap: wrap; */
	/* background: linear-gradient(to top, #16203b 0%, #16203bc7 40%, #16203b00 100%); */
	margin-top: 0%;  /*-25% */
	padding-bottom: 3%;
}


@keyframes floating-icon {
    0% {
      -webkit-transform: translateY(0);
      -moz-transform: translateY(0);
      -ms-transform: translateY(0);
      -o-transform: translateY(0);
      transform: translateY(0);
    }

    50% {
      -webkit-transform: translateY(4px);
      -moz-transform: translateY(4px);
      -ms-transform: translateY(4px);
      -o-transform: translateY(4px);
      transform: translateY(4px);
    }

    100% {
      -webkit-transform: translateY(0);
      -moz-transform: translateY(0);
      -ms-transform: translateY(0);
      -o-transform: translateY(0);
      transform: translateY(0);
    }
  }

/***********************************
New In
******************************/

.newin__area{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: auto;
}
.newin__area2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 88.3%;
    margin: auto;
}

.boutique-bg {
	width: 100%;
	padding: 2% 0% 0%;
	background: url(../images/boutique-pink.jpg) 100% 100% no-repeat;
	background-size: cover;
	background-color: #d2ccc5;
}

.newin__row{
    display: flex;
    flex-wrap: wrap;
}
.mainBox-bg {
    filter: saturate(1.0);
}

.newin_box {
    position: relative;
    width: 37.5%;
    margin: 0.5%;
}


.newin_box2 {
    position: relative;
    width: 18.4%;
    margin: 0.5%;
}

.bk-discount{
	background-color: #cb1c17;
}

.bk-discount-img {
	background-image: url(../images/img-xmas.jpg), url(../images/discount-snow.png);
	background-position: -3% 85%, 102% 40%;
	background-repeat: no-repeat, no-repeat;
	background-size: 440px 550px, 180px 430px;

	/* background-color: #cb1c17; */
	/*
	background-image: url(../images/bk-zone1.jpg);
	background-color: #c481b9;
    background-repeat: no-repeat;
	background-position: center bottom;
	*/
}
.bk-discount-gift {
	background-image: url(../images/gift-white-1920.png);
	background-repeat: no-repeat;
	background-position: right center;
	/* background-position: 0% 60%; */
}

.btn-pinknew {
    background-color: #f148a9 !important;
    color: white !important;
	border: 2px #f148a9 solid;
	width: 90%;
	font-weight: bold;
	padding: 4% 4%;
}

.btn-pinknew:hover {
    background-color: rgba(255, 255, 255, .85)!important;
    color:  #f148a9 !important;
    border: 2px #f148a9 solid;
}

.btn-pinkrow2 {
    background-color: transparent !important;
    color: #f148a9 !important;
	border: 2px #f148a9 solid;
	width: 90%;
	font-weight: bold;
	padding: 4% 4%;
}

.btn-pinkrow2:hover {
    background-color: #f148a9 !important;
    color:  #ffffff !important;
    border: 2px #f148a9 solid;
}

.lnewIn-bg {
    filter: saturate(1.1);
}

.paddng-B {
	padding-bottom: 3%;
}

.lnewIn-bg:hover {
	/* filter: saturate(1.8); */
	filter: contrast(130%);
    transform: scale(1.01);
	transition: all 0.2s;
	filter: drop-shadow(0px 0px 5px #7e5b25);
}
.lnewIn-bg img{
    border-radius: 0px;
}

.mtopL{
	margin-top: -18%;
}

.summer_leftBR{
	border-radius: 60px 0px 0px 0px;
}

#mtopR, .mtopR{
	margin-top: 18% !important;
}

/***********************************
好物推薦
******************************/

.goods-bg {
	width: 100%;
	padding: 2% 0% 0%;
	background: url(../images/goods-blue.jpg) 100% 100% no-repeat;
	background-size: cover;
	background-color: #d2ccc5;
}

/***********************************
Makeup (Fashion & Beauty)
******************************/


.makeup-box-text-wrap {
    width: 100%;
    margin: 0%;
    background-color: #fff1c9;
    bottom: -60px;
    text-align: center;
    padding: 3%;
}

.event-box-text-wrap {
    width: 86%;
    margin: 4% 7%;
    background-color: #fff;
    position: absolute;
    z-index: 3;
    bottom: -60px;
    border-radius: 16px;
    text-align: center;
    padding: 3%;
}

.event-box-text-wrap-2 {
    width: 86%;
    margin: 4% 7%;
    background-color: #fff;
    position: absolute;
    z-index: 3;
    bottom: -60px;
    border-radius: 16px;
    text-align: center;
    padding: 3%;
}

.btn-red2 {
    background-color: #ab011b !important;
    color: #ffffff !important;
    border: 2px #ab011b solid;
    font-weight: bold;
    padding: 2%;
    width: 50%;
    margin: 2% 25%;
}

.btn-red2:hover {
	background-color: transparent !important;
    color:#ab011b !important;
    border: 2px#ab011b solid;
}
.btn-shop {
	color: #ffffff !important;
	filter: drop-shadow(1px 1px 3px #393120);
    font-weight: bold;
    padding: 2%;
    position: absolute;
    bottom: 3%;
    right: 10%;
}
.btn-shop:hover {
	color:#fff9a6 !important;
	filter: drop-shadow(1px 1px 4px #2c2517);
}



.btn-pink3 {
    background-color: #0d856c !important;
    color: #fff !important;
    border: 2px #0d856c solid;
    font-weight: bold;
    padding: 2%;
    margin: 4%;
    font-size: 1vw;
    border-radius: 4px;
}

.btn-pink3:hover {
	background-color: #d60f08 !important;
    border: 2px#d60f08 solid;
}

/***********************************
  Summer Sale
******************************/

.summer_area {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 80%;
    margin: auto;
}

.summersale_box1 {
    position: relative;
    width: 49%;
    margin: 0.5%;
}

.summersale_box2 {
    position: relative;
    width: 24%;
    margin: 0.5%;
}

.btn-summer-wrapper {
	width: 42%;
	/* margin: 5% auto;
	margin: 10px auto; */
}

.btn-summer1 {
    /* line-height: 40px; */
    padding: 1.5%;
    text-align: center;
    position: absolute;
    z-index: 3;
	bottom: 13%;
    left: 15.5%;
}
.btn-summer1-B {
    /* line-height: 40px; */
    padding: 1.5%;
    text-align: center;
    position: absolute;
    z-index: 3;
	bottom: 35%;
	left: 18%;
}

.btn-summer2 {
    /* line-height: 40px; */
    padding: 3%;
    text-align: center;
    position: absolute;
    z-index: 3;
    bottom: 20px;
    right: 20px;
}
.summerS-bg {
    filter: saturate(1);
}
.summerS-bg img {
    border-radius: 0px;
}

.summerS-bg:hover img {
	filter: saturate(1.3);
	transform: scale(1.02);
    transition: all 0.2s;
}

.mb-discountBox{
	margin-bottom: 28% !important;
	margin-top: 28% !important;
}
.discountBox {
	position: relative;
	width: 75%; /* 80% */
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	box-sizing: border-box;
	padding-top: 0%;
}

.main-box-wrap {
	background: #fff;
    text-align: center;
    width: 100%;
    padding: 5%;
    /* border: 0px solid #111111; */
    border-radius: 24px 24px 24px 24px;
}

.dis-border-red {
	border: 6px solid #da4633;
}
.dis-border-blue {
	border: 6px solid #2d90c2;
}
.dis-border-green {
	border: 6px solid #499d71;
}
.dis-border-yellow {
	border: 6px solid #ffe33b;
}

.main-box-wrap2 {
    background: #ffd0d0;
    text-align: center;
    width: 100%;
    padding: 7%;
	border: 0px solid #111111;
	border-radius: 0px 0px 0px 70px;
}

.top_container {
    position: relative;
}

.fan-box-gold {
	position: absolute;
	z-index: 2;
	left: 24px;
	top: -30px;
    /* border-radius: 48px; */
    /* background: #4e74e4; */
    /* background-image: linear-gradient(to right, #4f75e4 ,#7292e8); */
	/* width: 31%; 
	height: 20.5%; */
}

.fan-box-red {
	position: absolute;
	z-index: 2;
	left: 0px;
	top: -30px;
}

.discountBox2 {
	position: relative;
	width: 80%; /* 80% */
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	/* justify-content: space-evenly; */
	justify-content: center;
    align-items: center;
	box-sizing: border-box;
}

.discountBox2_L {
	width: 49%; /* 80% */
}

/* .discountBox::before{
	content: "";
	display: block;
	position: absolute;
	right: 5%;
	bottom: 5%;
	background-color: #F4DE34;
} */
.discountBox ul li {
	list-style: none;
}
.discountBox ul li b{
	font-weight: bold;
}
.discountBox2 ul li {
	list-style: none;
}
.discountBox_default{
	position: relative;
	width: 32%;
	margin: 0% 0% 1%;
    padding: 0% 0.6%;
	background-size: contain;
	background-repeat: no-repeat;
}
.discountBox_default img{
    width: 100%;
	margin: 7px 0px;
	border-radius: 16px 16px 0px 0px;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}

.discountBox_default_row1{
	position: relative;
	width: 24%;
    margin: 0%;
    padding: 0.2%;
	/* border-radius: 14px; 
		width: 33%;
		margin: 0;
		padding: 2%;
	*/
	background-size: contain;
	background-repeat: no-repeat;
	/* box-shadow: #f4de34 26px 27px 0px; */
}

.discountBox_L_row2{
	position: relative;
	width: 100%;   /* width: 46.9%; */
    margin: 0% 1%;  /* margin: 0%; */
    padding: 0.2%;
	background-size: contain;
	background-repeat: no-repeat;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	/* box-shadow: #f4de34 26px 27px 0px; */
}

.discountBox_default_row2{
	position: relative;
	width: 30.5%;   /* width: 46.9%; */
    margin: 0% 1%;  /* margin: 0%; */
    padding: 0.2%;
	background-size: contain;
	background-repeat: no-repeat;
	display: inline-block;
	/*
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	box-shadow: #f4de34 26px 27px 0px; */
}
.discountBox_default_row2:nth-child(1){
	margin-left: -3%;
	z-index: 2;
}
.discountBox_default_row2:nth-child(2){
	margin-left: -3%;  /* margin: 0%; */
	z-index: 1;
}
.discountBox_default_row2:nth-child(3){
	margin-left: 0%;  /* margin: 0%; */
	z-index: 0;
}

.img-bor1 {
	border-radius: 24px 0px 0px 0px;
}
.img-bor2 {
	border-radius: 0px 0px 0px 24px;
}

.discountBox_default_row2 img{
	margin: 7px 0px;
}
.discountBox_default_row2 .g-img1 {
	border-radius: 16px;
	transform: rotate(5deg);
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}
.discountBox_default_row2 .g-img1:hover {
	transform: rotate(-5deg);
	transition: all 0.3s ease-out;
}
.discountBox_default_row2 .g-img2 {
	border-radius: 16px;
	transform: rotate(-6.5deg);
	width: 94%;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}
.discountBox_default_row2 .g-img2:hover {
	transform: rotate(6.5deg);
	transition: all 0.3s ease-out;
}
.discountBox_default_row2 .g-img3 {
	width: 109%;
}



.discountBox01,.discountBox02,.discountBox03, .discountBox04 {
	/* background-color: black;
	padding-top: 1%;*/
	padding: 3% 2% 3% 2%;
}


.discountBoxNo {
	display: inline-block;
	font-style: italic;
	text-align: center;
	padding-top: 5%;
	/* border: 1px solid #ffdf3f;
	padding: 15% 15% 0 0; */
}
.discountDate {
	position: relative;
	margin: -4% auto 0%;
	/* font-family: 'Noto Serif TC', Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei"; */
	line-height: 2em;
	letter-spacing: 3px;
	z-index: 1;
	font-weight: 600;
}

.discountBox ul li {
	list-style: square;
	color: #c17126;
	padding-bottom: 1%;
    /* list-style: none; */
}
.date_paddingL {
	padding-left: 20%;
}

.discountTitle{
	line-height: normal;
}
.date_1 {
	color:#fff;
	font-weight: bold;
}
.date {
	width: 56%;
	margin: 0% auto 1%;
}
.date img {
	width: 100%;
}
/*
content: "";
	position: absolute;
	width: 50%;
	height: 20px;
	background-color: #a5ebf7;
	right: 25%;
	bottom: 10px;
	z-index: -3;

.discountDate-color::after {
	background-color: #ffdf3f;
}*/

.img-box{
	display: inline-block;
	position: absolute;
	height: auto;
	z-index: 4;
}

.img-box-01{
	max-width: 14%;
	left: 9%;
	top: -13%;
}
.img-box-02{
	max-width: 12%;
	left: 10%;
	top: -11%;
}
.img-box-03{
	max-width: 12%;
	left: 54%;
	top: -12%;
}

/* 02 EBX 巨樂園  */
.playgroundBox {
	position: relative;
	width: 80%; /* 80% */
	box-sizing: border-box;
	padding-top: 0%;
    margin: 0% 10%;
}
.playgroundBox-L{
    position: relative;
    width: 48%;
	padding: 0% 1%;
	display: inline-block;
}
.playgroundBox-L img{
	width: 117.5%;
    margin-top: -9%;
}
.playgroundBox-R{
    position: absolute;
    width: 40%;
    margin: 0% 0% 0% 12%;
    padding: 0% 0.6%;
    border: #777 0px solid;
	display: inline-block;
	top:28%;
}
.playgroundBox .EBX-title{
	position: absolute;
	width: 38%;
    left: 35%;
    top: -10%;
	text-align: center;
	z-index: 5;
}
.playgroundBox .EBX-title img{
	width: 100%;
}
.playgroundBox-R h4 {
	background: #c51e43;
	color: #fff;
	font-size: 1.2vw;
	width: 80%;
	padding: 8px;
	border-radius: 20px;
	text-align: center;
	margin: 0% 14% 0% 6%;
}
.playgroundBox-R h6 {
	color: #c51e43;
	font-size: 1vw;
	width: 80%;
	padding: 4px 8px;
	text-align: center;
    margin: 0% 14% 0% 6%;
    font-family: Helvetica, Arial, sans-serif;

}
.f-h6-bold {font-weight: bold;}
.f-h6-nor {font-weight: normal;}

.playgroundBox-R ul{
	width: 100%;
    margin-top: 3%;
    margin-bottom: 8%;
}

.playgroundBox-R ul li{
	width: 47%;
	display: inline-block;
	/* list-style-type: square !important; */
}
.playgroundBox-R ul.b {
	list-style-type: none;
}
.playgroundBox-R ul li:nth-child(1){
	margin-right: 4%;
    border-right: 1px #aaa solid;
    padding-right: 3%;
}
.playgroundBox-R ul li h3{
	color: #3c2e7e;
	font-size: 1.5vw;
	font-weight: 600;
	padding-bottom: 2px;
}
.playTxtType::before {
	content: '■ ';
    /*  content: '◆ ';  */
	color: #c51e43;
	font-size: 1vw;
}

.playgroundBox-R ul li p{
	color: #3c2e7e;
	font-size: 0.9vw;
	font-weight: 600;
	line-height: normal;
	padding-left: 1.2em;
    letter-spacing: 0px;
}



/* newSale 黑五精品特賣  START */
.newSale{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
	padding: 2% 0%;
}

.newSale__box{
	position: relative;
	width: 25%;
	margin: 0 1%;
}
.newSale img:hover{
	filter: saturate(1.4);
	transition: all 0.2s;
	opacity: 0.8;
}
.newSale__box01{
	position: relative;
}



.newSale__box02__content{
	position: relative;
}


.newSale__box03__content{
	position: relative;
	margin-top: 8%;
}

.newSale__box04{
	position: relative;
	margin-top: 5.5%;
}

.newSale__box__text{
	position: absolute;
	color: white;
	font-weight: 600;
}
.newSale__box__text_01,.newSale__box__text_04{
	left: 33%;
	top: 37%;
}
.newSale__box__text_02, .newSale__box__text_03 {
    left: 33%;
    top: 28%;
}


.newSale__box__btn__wrap{
	position: absolute;
	width: 100%;
}
.newSale__box__btn__wrap_01,.newSale__box__btn__wrap_04{
	bottom: 30%;
	left: 0%;
}

.newSale__box__btn__wrap_02,.newSale__box__btn__wrap_03{
	bottom: 18%;
	right: 2%;
}



/* newBrand 精品品牌們  START */
.newBrand__wrapper{
	width: 100%;
}
.newBrand{
	width: 80%;
	margin: 0 auto;
}

/* newBrand 精品品牌們  END */

/* gift 限量美妝大禮包  START */

.img_1111{
	position: absolute;
	width: 20%;
	top: 3%;
	left: 35%;

}

.gift__wrap{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	padding: 5%;
}

.gift__area{
	width: 40%;
	border: 0.25rem solid #FFB236 ;
	padding: 3% 2% 2% 4%;
}

.gift__img{
	width: 35%;
	margin: 3%;
}

.gift__info{
	margin-top: 5% ;
}



/*******************
EBX 宇宙級贈禮
*******************/

.brand-wrap {
	width: 100%;
    text-align: center;
}

.brand-wrap .brand-wrapper {
    /* width: 1420px;
    margin: 0 auto; */
	width: 75%;
	height: 22vw;
    margin: 0% 12.5% 4%;
	border: 0px #aaa solid;
	position: relative;
}

.brand-wrapper .brand-img{
	vertical-align: middle;
	width: 60%;
	position: absolute;
	z-index: 2;
	left: 1%;
	top: 0%;
}

.brand-wrapper .brand-img img {
    width: 100%;
}

.brand-wrapper .brand-img img:hover {
    transform: scale(1.05);
}

.brand-wrapper .brand-content {
	width: 53%;
	height: 100%;
    background: rgba(255, 255, 255, 0.3);
    margin: 2% 0% 0%;
    position: absolute;
    right: 2%;
    top: 0%;
    border-radius: 16px;
}

.brand-wrapper .brand-content-gift {
	width: 33%;
    margin: 0% 0% 0%;
    position: absolute;
    z-index: 3;
    right: 5%;
    top: 0%;
}

.brand-wrapper ul {
    width: 100%;
    margin: 30px auto;
}

.brand-wrapper ul li {
    display: inline-table;
    vertical-align: middle;
}

.brand-wrapper ul li:nth-child(1) {
	width: 55%;
	z-index: 2;
    position: relative;
    /* overflow: hidden; */
}

/* 
.brand-wrapper ul li:nth-child(2) {
    width: 39%;
    text-align: left;
    background: white;
    padding: 40px 50px;
    position: relative;
    left: -80px;
}
*/



.brand-wrapper ul li:nth-child(2) {
    width: 44.5%;
    text-align: left;
    background: #f5f3f3;
    padding: 40px 50px;
    position: relative;
    left: -70px;
}
.brand-wrapper ul li:nth-child(1) img {
    width: 100%;
}

.brand-wrapper ul li:nth-child(1) img:hover {
    transform: scale(1.05);
}

.brand-wrapper ul li h4 {
    margin-bottom: 10px;
}

.brand-wrapper ul li p {
    margin-bottom: 15px;
}

.brand-wrapper a:hover ul li:nth-child(2) {
    background: #f9f9f9;
    -webkit-filter: drop-shadow(6px 6px 0px #cccccc);
    /* Safari */
    filter: drop-shadow(6px 6px 0px #cccccc);
    left: -90px;
    transition: all .2s cubic-bezier(0, 0, 0.58, 0);
}

.brand-wrapper ul li:nth-child(2) img:hover {
    transform: scale(1.05);
}

/*  brand story  */
.brandstory-title {
    /* font-size: 54px; */
    font-size: 2.7vw;
    color: #000;
    margin-bottom: 0.25em;
    font-weight: normal;
    text-align: left;
    padding-left: 34px;
    border-left: 8px #f5d941 solid;
}

/*---------  gift 限量美妝大禮包 END   ----------*/

.beautySale__wrapper{
	padding-top: 3%;
}





/*  EBX許願流程 5 STEPS */
.flow_wrap {
	text-align: center;
    padding: 1.5% 0% 2%;
}

.flow_bk {
	background: linear-gradient(to bottom, #2a1958 15%, #564bb4 90%);
}
.flow_bk_img {
	background-image: url(../images/BK-step.jpg);
    background-repeat: no-repeat;
    background-position: 0% 38% ;
    background-size: 100%;
}

.title-area2 {
    max-width: 80%;
    width: auto;
	height: auto;
	margin: 0% 10%;
}

.title-area2 h2 {
	font-family: "Noto Sans TC", sans-serif;
	font-size: 4vw;
	color: #fff;
	font-weight: 900;
	font-style: italic;
	letter-spacing: 4px;
	padding-bottom: 1vw;
}

.stepBox {
    width: 66%;
    margin: 2% auto 1%;
	position: relative;
	z-index: 1;
}

.stepBox ul {
    width: 100%;
    margin: 0% auto 0%;
    background-image: url(../images/arrow-1220.png);
    background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100%;
}

.stepBox ul li {
	width: 16.4%;
	margin: 0.3% 1.5% 1%;
	padding: 0% 2%;
    display: inline-table;
}
.stepBox ul li img{
    border-radius: 50%;
    width: 100%;
}

.stepBox ul li h3{
    font-size: 1.8vw;
    font-weight: bold;
}

.stepBox ul li h5{
    font-size: 1.2vw;
    font-weight: bold;
}
.stepBox ul li h6{
    font-size: 0.95vw;
	font-weight: bold;
	text-align: left;
}
.stepBox ul li p {
    font-size: 0.9vw;
	font-weight: normal;
	text-align: left;
}
.stepTxt, .stepTxt1, .hashtagTxt,.stepTxt2 {
    position: absolute;
    line-height: normal;
}

.stepTxt {
	width: 15%;
	/* color: #242424; */
    padding: 13% 0% 0% 0%;
}
.stepTxt1 {
	width: 15%;
	/* color: #242424; */
    padding: 15% 0% 0% 0%;
}
.hashtagTxt {
	width: 15%;
	/* color: #242424; */
    padding: 20% 0% 0% 0%;
}
.stepTxt2 {
	width: 13%;
    padding: 15% 0% 0% 0%;
}


/* .stepTxtType::before {
    content: '◆ ';
    color: #b458fc;
}
*/

/*  04 示範貼文 */
.sticker_wrap {
	text-align: center;
    padding: 5% 0% 1%;
}

.sticker_title {
    width: 14%;
    margin: 1% 43%;
    font-size: 2vw;
    font-weight: 600;
    color: #fff;
    padding: 4px 16px;
    border: 2px #f9819d solid;
    border-radius: 28px;
}

.sticker_bk {
	background: linear-gradient(to bottom, #ededed 0%, #9dd0e3 100%);
}

.stickerBox {
    width: 75%;
    margin: 1% auto 0%;
	position: relative;
	z-index: 1;
}

.stickerBox ul {
    width: 100%;
    margin: 0% auto 0%;
}

.stickerBox ul li {
    width: 25.2%;
    margin: 0.3% 1.2% 1%;
    display: inline-table;
}
.stickerBox ul li img{
    width: 100%;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}



/********** 05 小提示!宇宙熊出沒地點 */
/* 
.location_bk {
	width: 100%;
    margin: 0% auto 3%;
    background-image: url(../images/EBX-tip-h720.jpg);
    background-repeat: no-repeat;
    background-position: center;
	background-size: 100%;
	display: block;
}

.ec2recommended {
    position: relative;
    width: 100%;
    background: linear-gradient(to bottom rgb(72, 201, 239) 0vh, rgb(71, 251, 206) 50vh); 
    overflow: hidden;
}
*/

.ec2recommended {
    position: relative;
    width: 100%;
	background-image: url(../images/EBX-tip-h720.jpg);
	background-size: 100%;
    overflow: hidden;
}


.ec2desktop{
	display: block;
}
.ec2pad{
    display: none;
}
.ec2mobile{
	display: none;
}
.recommended_bg{
    position: absolute;
    width: 100%;
    height: auto;
    overflow: hidden;
}

.local-text {
	margin-top: 1em;
	margin-bottom: 0.5em;
}
.local-text h4{
	font-size: 1.3vw;
	color: #2b4580;
	padding-bottom: 0.8vw;
	letter-spacing: -1px;
}
.local-text img{
    width: 25px;
    height: 36px;
	display: inline-block;
	margin-right: 0.2vw;
    /* object-fit: cover; */
}
.local-text p{
	font-size: 0.9vw;
    display: inline-block;
	border: 0px #777 solid;
	text-align: left;
	line-height: normal;
	color: #555;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-352px * 8 - 32px * 8));
        /* 
		transform: translateX(calc(-352px * 8 - 32px * 8)); 
		transform: translateX(-100%); */
    }
}


#marquee {
    overflow: visible;
	/* overflow: hidden; */
    width: 100%;
    margin: 0% 0% 0%;
}

#marquee .pic-container {
    display: flex;
    animation: marquee 120s infinite linear;
}
#marquee .pic-container {
	white-space: nowrap;
	position: relative;
	padding: 0%;
	/* padding: 0 2em 0 2em; 
	-webkit-overflow-scrolling: touch;*/
}

#marquee .pic {
	border-radius: 16px;
    width: 352px;
    flex-shrink: 0;
    /* margin-right: 50px; */
	display: inline-block;
	background: #fff;
	text-align: center;
	padding: 1em 1em 1em 1em;
	margin: 0 2em 2em 0;
	white-space: normal;
	opacity: 1.0;
	-moz-transition: opacity 0.75s ease-in-out;
	-webkit-transition: opacity 0.75s ease-in-out;
	-ms-transition: opacity 0.75s ease-in-out;
	transition: opacity 0.75s ease-in-out;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.3));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.3));
}
#marquee .pic .pimg {
    width: 100%;
}

#marquee article {
	display: inline-block;
	width: 18em;
	background: #fff;
	text-align: center;
	padding: 0 1em 3em 1em;
	margin: 0 2em 2em 0;
	white-space: normal;
	opacity: 1.0;
	-moz-transition: opacity 0.75s ease-in-out;
	-webkit-transition: opacity 0.75s ease-in-out;
	-ms-transition: opacity 0.75s ease-in-out;
	transition: opacity 0.75s ease-in-out;
}





/*
#marquee img {
    width: 100%;
    vertical-align: middle;
}
*/

/***************************
@keyframes marqee {
	0% {
	 left: 100%;
	 transform: translateX(0%);
	}
   
	100% {
	 left: 0;
	 transform: translateX(-100%);
	}
}
@keyframes scroll {
	0% { transform: translateX(0); }
	100% { transform: translateX(calc(-250px * 7))}
}

****************************/


.freebieDesc {
    margin: 0% 10% 0%;
	background-color: transparent;
}
.dot_yellow {
    background: url(../images/dot_yellow.gif) 0% 0% repeat-x;
}

/* ------------------ 限量美妝 limitBeauty ------------------ */
.limitBeauty__wrapper{
	position: relative;
	width: 100%;
	display: block;
	text-align: center;
	background-color: #6DC1C1; /*#FF928A; */
}
/* .two__two__wrap{
	position: relative;
	width: 100%;
	margin: 1%;
	display: inline-table;
} */


.three__one__wrapper{
	display: inline-flex;
	position: relative;
	align-items: center;
	justify-content: space-evenly;
	flex-wrap: wrap;
}
.three__one__content{
	position: relative;
	/* width: 100%; */
	margin: 4% 0;
	/* margin: 0 auto; */
}
.three__one__box:hover, .two__two__box:hover, .two__two__content__img__info>img:hover{
	transform: scale(1.03);
	transition: all 0.2s;
}
.three__one__perBox a:hover, .two__two__perBox a:hover, .two__two__content__img__info>img:hover{
	/* opacity: 0.9; */
	filter: saturate(1.4);
	transition: all 0.2s;
}
.three__one__content__img__info{
	display: inline-block;
	/* position: absolute; */
	max-width: 65%;
}
.three__one__box {
	position: relative;
	width: 28%;
	height: 100%;
	margin: 3% 1%;
	display: inline-table;
	text-align: center;
	color: black;
	border-radius: 20px; /* 30px 30px 0px 20px; */
}

.three__one__box__title{
	/* font-family: 'Noto Serif TC', Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei"; */
	text-transform: uppercase;
	margin: 10% 0;
	color: #FF2A4E;
	font-weight: 600;
}
.three__one__wrapper .img__title__date{
	display: inline-block;
	position: absolute;
	/* height: auto; */
	max-width: 28%;
	left: 35%;
	top: -18%;
	z-index: 1;
}





.two__two__wrapper{
	display: inline-flex;
	position: relative;
	align-items: center;
	justify-content: space-evenly;
	/* margin-right: 2%;
	width: 100%;*/
}
.two__two__content{
	position: relative;
	/* width: 100%; */
	margin: 4% 0;
	/* margin: 0 auto; */
}

.two__two__content__img__info{
	display: inline-block;
	/* position: absolute; */
	max-width: 65%;
}

.two__two__wrapper .img__title__date{
	display: inline-block;
	position: absolute;
	/* height: auto; */
	max-width: 40%;
	left: 29%;
	top: -15%;
	z-index: 1;
}
.img__platform{
	display: inline-block;
	position: absolute;
	/* height: auto; */
	max-width: 30%;
	left: 35%;
	bottom: -4%;
	z-index: 0;
}

.two__two__box {
	position: relative;
	width: 43%;
	height: 100%;
	margin: 3% 1%;
	display: inline-table;
	text-align: center;
	color: black;
	border-radius: 20px; /* 30px 30px 0px 20px; */
}

.two__two__box__title{
	font-family: futura-pt, 'Crimson Text', Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei";
	text-transform: uppercase;
	margin: 10% 0 2% 0;
	color: #FF2A4E;
	font-weight: 600;
}





.leaf {
	display: inline-block;
	position: absolute;
	height: auto;
	max-width: 20%;
	left: 10%;
	top: -20%;
	z-index: 1;
}
.mask {
	display: inline-block;
	position: absolute;
	height: auto;
	max-width: 21%;
	left: 69%;
	top: 35%;
	z-index: 1;
}
.hightlight {
	display: inline-block;
	position: absolute;
	height: auto;
	max-width: 7%;
	left: 79%;
	top: 12%;
	z-index: 1;
	animation: hightlight 1.8s infinite;
	animation-delay: 1s;
	animation-iteration-count: 5, 0, infinite;
}
@keyframes hightlight {
	0% {
		opacity: 1;
	}
	15% {
		opacity: 0;
	}
	50%{
		opacity: 1;
	}
	80% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.lightning {
	display: inline-block;
	position: absolute;
	max-width: 10%;
	height: auto;
	right: 15%;
	top: 47%;
	z-index: 1;
	animation: lightning 1.4s infinite;
}
@keyframes lightning {
	0% {
		opacity: 1;
	}
	20% {
		opacity: 0;
	}
	35% {
		opacity: 1;
	}
	80% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.mt5 {
	margin-top: 5%;
}
.mb5 {
	margin-bottom: 3.5%;  /* 5%  */
}
.mg5{
	margin: 5% 0;
}
.mg3{
	margin: 3% 0;
}
.discountText {
	line-height: 1.5em;
	/* margin-bottom: 2%; */
	padding: 1% 0;
	z-index: 5;
}
.discountText02, .discountText02_H {
	margin-bottom: 2%;
}
.discountText02_H {
	visibility: hidden;
}


/*new arrival*/

.newArea {
	width: 100%;
	color: #fcf1c3;
	/*#FFDE3F;*/
	padding-top: 4%;
	padding-bottom: 4%;
	background-color: #66B7D3;
}
.newArea a {
	color: #fcf1c3;
	/*#ef2874 #e4e4e4; */
}
.newBox {
	width: 100%;
	margin: 0 auto;
}

.TitleBox {
	/* width: 6%; */
	margin: 0;
	/* margin: 0 2%; */
	/* width: 15%; */
}
/* .Title {
	writing-mode: vertical-rl;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: vertical-rl;
	padding: 2%;
	background-color: #eb3e80;
	box-shadow: -4px -4px 0px 2px #a5ebf7;
	font-style: italic;
} */

.bigBox{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}
.bigBox__content{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 4%;
	/* width: 100%; */
	/* background-image: url(../images/bigBox__img.png);
	background-size: contain;
	background-repeat: no-repeat; */
	/* padding: 2% 5%; */

}



.bigBox__img__pc{
	text-align: center;
	position: relative;
	width: 80%;
	/* height: auto; */
	z-index: -1;
	display: block;
}
.bigBox__img__mobile{
	text-align: center;
	position: relative;
	width: 60%;
	z-index: -1;
	display: block;
}

.bigBox__info__wrap{
	position: absolute;
	/* display: flex; */
	 display: inline-block;
	/*width: 100%;*/
	z-index: 1;
	/* margin: 0.5%; */
	top: 26%;
	left: 47%;
}
.bigBox__info__img{
	position: relative;
	/* max-width: 100%; */
	margin: 0 5% 0 0;
}
.bigBox__info{
	padding-right: 10px;
}

.bigBox__info1, .bigBox__info2, .bigBox__info3{
	margin: 3% 0;
}




.newItemBox {
	/* width: 90%; */
	width: 100%;
	display: flex;
	margin-top: 30px;
}
.newItem {
	width: 30%;
	margin: 1.5%;
}
.newItem ul li {
	list-style: none;
}
.newPic:hover {
	filter: saturate(1.3);
}
.newTitle {
	margin: 3.5% 0;
	line-height: 1.3em;
}


.btn-size{
	display: inline-block;
	border: 1px solid white;
	padding: 8px 17px;
	margin: 1% 4% 6%;
}
.btn-size:hover{
	border: 1px solid black;
	color: #020100;
	background-color: rgba(255, 255, 255, 0.281);
}
.newBtn {
	border: 1px solid #FFCC24;
	padding: 3%;
}
.newBtn:hover {
	background-color: #FFCC24;
	color: #fff;
}
/*brand*/

.brandTitleBox>.title {
	/* font-family: 'Noto Serif TC', serif, Helvetica, Arial; */
	font-size: 60px;
	font-weight: 600;
	line-height: 1.2em;
	letter-spacing: 1px;
	color: #fb4273;
	font-style: italic;
}
.brandArea {
	padding-top: 2.5%;
	width: 100%;
	margin: 0% auto;
	text-align: center;
	background: linear-gradient(to top, #2d7760 0%, #095634 100%);
}
.brandTitleBox {
	padding-top: 2%;
	margin-bottom: 1.5%;
}

.brandBox_makeup {
	width: 100%;
	margin: 0%;
	padding: 0%;
}
.GiftArea {
	position: relative;
	width: 100%;
	margin: 0% auto;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 0%;  /*-25% */
	padding-bottom: 3%;
}

.brandBox {
	width: 90%;
	margin: 0 auto;
	padding-bottom: 2%;
}

.makeupBox {
	width: 90%;
	margin: 0 auto;
	padding-bottom: 2%;	
}
.makeupBox2 {
	position: relative;
	text-align: center;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-evenly;
	box-sizing: border-box;
	padding-top: 0%;
	padding-bottom: 0%;
}

.makeupBox a:hover {
	transition: all .2s cubic-bezier(0, 0, 0.58, 0);
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    /* -webkit-filter: drop-shadow(6px 6px 0px #760007); */
    /* Safari */
	/* filter: drop-shadow(6px 6px 0px #760007); */
}

.makeupBox2 a:hover {
	transition: all .2s cubic-bezier(0, 0, 0.58, 0);
	/* -webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2)); */
}

.musthaveBox {
	width: 90%;
	margin: 0 auto;
	padding-bottom: 2%;	
}

.musthaveBox a:hover {
	transition: all .2s cubic-bezier(0, 0, 0.58, 0);
    -webkit-filter: drop-shadow(6px 6px 0px #8d5f20);
    /* Safari */
	filter: drop-shadow(6px 6px 0px #8d5f20);
}

.makeupBox img, .makeupBox2 img {
    transform: scale(1);
    border-radius: 8px;
}

.makeupBox img:hover, .makeupBox2 img:hover {
	filter: saturate(1.2);
	/* transform: scale(1.05);
	overflow: hidden; */
}

.brandContentBox {
	width: 23%;
	background-color: #f6f6f6;
	padding: 1.5% 0 0;
	display: inline-table;
	margin: 0 0.5% 1%;
	position: relative;
	border-radius: 16px;
	/* filter: drop-shadow(3px 4px 3px #6c0108);
	border: 1px transparent solid; */
}

.brandContentBox:hover {
	/* border: 1px #ff81c9 solid;
	filter: drop-shadow(3px 4px 3px #ff81c9); */
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.3))
}
.brandTitleTag {
	/* font-family: 'Noto Serif TC', Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei"; */
	color: #b13135;
	border: 1px solid #b13135;
	display: inline-block;
	padding: 1% 4%;
	font-size: 0.75vw;
	line-height: 1.2em;
}
.brandTitleTag_H {
	border: 1px solid #b13135;
	display: inline-block;
	padding: 1% 4%;
	font-size: 0.75vw;
	line-height: 1.2em;
	visibility: hidden;
}
.brandTitle {
	/* font-family: 'Noto Serif TC',"微軟正黑體", "Microsoft JhengHei", Helvetica, Arial, sans-serif; */
	/* font-family: 'Crimson Text', Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei"; */
	text-transform: uppercase;
	font-size: 1.7vw;
	color: #333;
	margin: 2.5% 0;
}
.brandTitle02 {
	font-family: futura-pt, Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei";
	font-size: 0.9vw;
	line-height: 1.2em;
}
.brandPic {
	margin-top: 2%;
	bottom: -3px;
	position: relative;
}
.brandPic img {
    width: 100%;
}

.btn-50off {
    padding: 2% 3%;
    text-align: center;
    font-size: medium;
    font-weight: 600;
	position: absolute;
	right: 22px;
	bottom: 22px;
}
.btn {
	/* line-height: 40px; */
	padding: 3%;
	text-align: center;
}
.btn_brand {
	position: absolute;
	bottom: 8%;
	width: 50%;
	left: 25%;
	color: #fff;
	background-color: rgba(0, 0, 0, .7);
	border-radius: 4px;
}
.btn_brand:hover {
	background-color: rgba(214, 15, 8, .9);
}

.btn__seemore {
	position: relative;
	width: 22%;
	height: 100%;
	/* margin: auto; */
	margin: 2% 0 0 0;
	display: inline-block;
	/* display: inline-table; */
	text-align: center;
	color: black;
}
/*******************
event wrap
*******************/

.wrapper {
	padding: 3% 0;
}

.wrapper-title-wrap {
	margin-bottom: 15px;
	text-align: center;
}
.sec-title {
	/* font-family: 'Noto Serif TC', serif, Helvetica, Arial; */
	font-size: 65px;
	font-weight: 600;
	font-style: italic;
	line-height: 80px;
}

.title-pd{
	padding: 0% 0% 1%;
	text-align: center;
}

.title-area {
	position: relative;
	padding-top: 2%;
	color: #fff;
}
.title-area-selected {
	position: relative;
	padding-top: 0%;
}
.title-area-selected img {
	width: 100%;
}

/*   階段ㄧ
.title-area p {
	position: absolute;
    left: 64%;
    bottom: 16%;
    z-index: 3;
    color: #fff;
    width: 16%;
	border: 0px #fff solid;
} */
.title-area h3 {
	margin:1% 6%;
	line-height: normal;
} 
.title-area p {
    bottom: 16%;
	width: 80%;
	margin:1% auto;
} 
.title-area img {
	/* max-width: 33%; */
	position: relative;
	margin: 0%; /* 2% 0 1% 0;*/
	max-height: 100%;
	width: auto;
	height: auto;
	z-index: 2;
}
.title-area .title-img7 {
	margin-top: 6%;
}
/*
.title-area .EBXinfo-text {
    position: absolute;
    left: 64%;
    bottom: 14%;
    z-index: 3;
    color: #fff;
    width: 10%;
	border: 0px #fff solid;
}
*/
.title-area .EBXinfo-text a {
	font-size: larger;
	color: #fff;
	text-decoration: underline;
}
.title-area .EBXinfo-text a:hover {
	font-style: italic;
	text-decoration: none;
}

.icon__discount{
	position: absolute;
	left: 0%;
	top: 0%;
	z-index: 3;
}

.icon__discount__text{
	position: absolute;
	color: white;
	left: 25%;
	top: 30%;
	transform: rotate(-10deg);
	z-index: 5;
}

.event-box-title{
	text-transform: uppercase;
}
.event-box-wrap {
	position: relative;
	text-align: center;
	/* padding-top: 2.5%; */
	padding-bottom: 0%;
}
.event-box-wrap ul {
	width: 55%;
	margin: 0 auto;
}

.brandBox_per_noBG {
	position: relative;
    width: 100%;
    margin: 1% 0% 1.3%;
    font-weight: 600;
	padding: 0%;
	/* display: inline-table; 
	filter: drop-shadow(3px 4px 3px #666);
	-webkit-filter: drop-shadow(6px 6px 3px rgba(0, 0, 0, 0.4));
	filter: drop-shadow(6px 6px 3px rgba(0, 0, 0, 0.4));*/

}
.gift-box-wrap {
	position: relative;
	text-align: center;
	padding-top: 2.5%;
}
.bk-gift4Him-img {
	background-color: #ce130f;
	/* background:linear-gradient(to top, #271551 0%, #564bb4 100%)*/
	/*background: linear-gradient(131deg, #89faff 5%, #aad4fe 60%, #9999ff 100%);
	background: linear-gradient(to bottom, #564ff5 0%, #9990f9 58%, #bbaeff 100%); */
}
.brandBox_per_noBG:hover {
	transform: scale(0.98);
}

.img-a{
	padding-top: 5%;
}
.img-b{
	padding-top: 0%;
}

.Box_even {
	margin-top: 10%;
}

.brandBox_per_food {
	position: relative;
    width: 41.2%;
    height: 100%;
    margin: 1% 1% 1.3%;
    display: inline-table;
    font-weight: 600;
    padding-bottom: 0%;
	/* border-bottom: #f6a024 0px solid;
	border-radius: 20px; */
}
.brandBox_per_food:hover {
	transform: scale(0.98);
}

.eventbox__content{
	display: flex;
	justify-content: space-between;
}

.event-box-wrap-snack {
	position: relative;
	text-align: center;
	padding-top: 3%;
	padding-bottom: 3%;
}

.btn-wrapper-more2 {
    width: 18.2%;
	margin: 0.5% auto 2%;
	display: inline-block;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}
.btn4 {
    padding: 0 7%;
    text-align: center;
}
.moreBtn1 {
    width: 18%;
    font-size: large;
    font-weight: bold;
    background-color: #da4733 !important;
    color: #ffffff !important;
    border: 3px #ffffff solid;
    border-radius: 20px;
    padding: 8px 4px;
    margin: 0% 41% 1%;
}
.moreBtn1:hover {
    background-color: #ffffff !important;
    color: #da4733 !important;
    border: 3px #da4733 solid;
}


/* Summer SALE */
.event-box-wrap-V {
	position: relative;
	text-align: center;
	padding-top: 3%;
	padding-bottom: 0%;
}

.brandBox_bestChoice {
	width: 100%;
	margin: 0%;
	padding: 0%;
}

.bk-santa-img {
	background-image: url(../images/title3-selected-bk.jpg);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 100%;
}
.santa-img {
	width: 60%;
}

/***********************************
New In  (精品5折起)
******************************/
.newin__area{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: auto;
}
.newin__area2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 88.3%;
	margin: auto;
	padding-bottom: 2.5%;
}
.newin__row{
    display: flex;
    flex-wrap: wrap;
}
.mainBox-bg {
    filter: saturate(1.0);
}

.newin_box {
    position: relative;
    width: 23%;
    margin: 0.5%;
}

.newin_box2 {
    position: relative;
    width: 26%;
    margin: 0.5%;
}

.btn-newin {
    position: absolute;
	z-index: 3;
	top: 245px;
    right: 35px;
}
.btn-newin1 {
    position: absolute;
	z-index: 3;
	top: 405px;
    right: 35px;
}
.btn-newin2 {
    position: absolute;
	z-index: 3;
	top: 210px;
    right: 105px;
}
.btn-newin3 {
    position: absolute;
	z-index: 3;
	top: 200px;
    right: -105px;
}
.btn-pinknew {
    background-color: #f148a9 !important;
    color: white !important;
	border: 2px #f148a9 solid;
	width: 90%;
	font-weight: bold;
	padding: 4% 4%;
}

.btn-pinknew:hover {
    background-color: rgba(255, 255, 255, .85)!important;
    color:  #f148a9 !important;
    border: 2px #f148a9 solid;
}

.btn-pinkrow2 {
    background-color: transparent !important;
    color: #f148a9 !important;
	border: 2px #f148a9 solid;
	width: 90%;
	font-weight: bold;
	padding: 4% 4%;
}

.btn-pinkrow2:hover {
    background-color: #f148a9 !important;
    color:  #ffffff !important;
    border: 2px #f148a9 solid;
}


.lnewIn-bg {
    filter: saturate(1.1);
}
.lnewIn-bg:hover {
	/* filter: saturate(1.8); */
	filter: contrast(130%);
    transform: scale(1.03);
    transition: all 0.2s;
}
.lnewIn-bg img{
    border-radius: 0px;
}

.mtopL{
	margin-top: -18%;
}

#mtopR, .mtopR{
	margin-top: 18% !important;
}


/* brandBox_per */
/* event-box-wrap ul li */

.brandBox_per {
	position: relative;
	width: 22%;
	height: 100%;
	margin: 3% 1%;
	display: inline-table;
	/* text-align: center; */
	color: black;
	background-color: #FFDDD4;
	/* border-radius: 20px; */
}
.bg-beauty-info-box:hover{
	/* transform: scale(1.02); */
	/* transform: rotate(3deg); */
	transform: scale(0.97);
	transition: all 0.2s;
	filter: drop-shadow(3px 4px 3px #333333);
}
.brandBox_per__border{
	border: 0.4rem solid #FFEF07;
}
.bg-no-color{
	background-color:transparent !important;
}
ul.event-box-wrapper:nth-child(3) li{
	width: 31%;
}
#limitBeauty .bg-beauty-info-box{
	background-color: #ffffff;
}
#limitBeauty .bg-beauty-info-box-x{
	background-color: #787878;
}

#mustBuy .bg-beauty-info-box{
	background-color: #FFDDD4;
}

.border-fuchsia {
	border: 2.5px solid #EB3E80;
}
.text-event-date {
	/* font-size: 6vh; */
	color: #FFDE3F;
	text-shadow: 0.1em 0.1em rgb(18, 17, 17);
	position: absolute;
	/* top: -5%;
    left: 40%; */
	z-index: 2;
	transform: rotate(-5deg);
}
.event-box-date img {
	max-width: 45%;
	position: absolute;
	top: -10%;
	left: 25%;
}

.event-box-img-wrap .aaa {
	width: 100%;
	transform: scale(1);
	/* opacity: .9; */
}
.event-box-img-wrap .aaa:hover {
	width: 100%;
	filter: saturate(1.1);
	/* opacity: .9; */
}

.makeup-box-text-wrap h4 {
	/* font-family: 'Noto Serif TC'; */
	font-size: 1.4vw;
    line-height: normal;
    font-weight: 600;
}

.makeup-box-text-wrap h5 {
	font-size: 1.3vw;
    line-height: normal;
    font-weight: 600;
}

.makeup-box-text-wrap p {
	font-size: 1.1vw;
    line-height: normal;
    font-weight: 600;
}
.event-box-img-wrap  img {
	width: 100%;
	transform: scale(1);
	/* opacity: .9; */
}
.makeup-box-img-wrap img:hover {
	width: 100%;
	transform: scale(1.1);
	/* opacity: .9; */
}



.event-box-text-wrap h4 {
	font-size: 1.4vw;
    line-height: normal;
    font-weight: 600;
}
.event-box-text-wrap h5 {   /* 單使用於Godiva*/
	font-size: 1.2vw;
    line-height: normal;
    font-weight: 600;
}

.event-box-text-wrap p {
	font-size: 1.2vw;
	line-height: normal;
    font-weight: 600;
}

.event-box-text-wrap-2 h4 {
	font-size: 1.4vw;
    line-height: normal;
    font-weight: 600;
}

.event-box-text-wrap-2 p {
	font-size: 1.2vw;
	line-height: normal;
    font-weight: 600;
}

.event-box-content {
	line-height: 1.3em;
}

.event__box__img__wrap__btn{
	position: absolute;
	width: 65%;
	/* max-width: 75%; */
	bottom: 10%;
	left: 18%;
}

/*
.btn-wrapper>.btn {
	padding: 0.5% 3%;
	display: inline-block;
}
*/

.event-box-wrap ul a:hover .event-box-img-wrap img {
	opacity: 0.9;
	transition: all .2s linear;
}
.event-box-wrap ul a:hover .btn {
	background: #e5e646;
	color:black;
	transition: all .2s linear;
}

/********************
12 新品優惠 市價59折起
********************/

.newIn-bg{
	width: 100%;
	padding: 0% 0% 0%;
	background: url(../images/bk-newArrivals.jpg) center top no-repeat;
	/* background: linear-gradient(to bottom, #916dda 5%,#ffc0d3 100%) !important;*/
	background-size: cover;
}
.newIn-box-wrap {
	text-align: center;
	width: 100%;
	padding-top: 2%;
	padding-bottom: 2%;
}
.newIn-box-wrap ul {
	width: 80%;
	margin: 0 auto;
}
.newIn-box-wrap ul li {
	width: 22%;
	margin: 1% 1%;
	position: relative;
	display: inline-table;
	text-align: center;
	color: black;
	border: 4px #f9efe5 solid;
    background-color: #e7e7e7;
	padding: 0% 0% 0.5% 0%;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}
.newIn-box-wrap .btn-wrapper {
	margin: 10px auto;
}
.newIn-box-wrap ul a:hover .newIn-img-wrap img {
	opacity: 1;
	transition: all .2s linear;
}
.newIn-box-wrap ul a:hover .btn {
	background: #66b7d3; /* #c70000 */
	color: white;
	transition: all .2s linear;
}
.newin-box-img-wrap img{
	width: 100%;
	position: relative;
	z-index: 1;
	padding-bottom: 3%;
	/* opacity: .9; */
}

.btn_newin {
    width: 92%;
	color: #fff;
	background-color: #c51e43;
    /* background: linear-gradient(to right, #349cd7 0%,#976afd 45%,#ec5484 100%) !important; */
    border: 0px #c51e43 solid;
    margin: 0% 4%;
    font-weight: 600;
	font-size: large;
    padding: 3%;
}

.newin-box-text-wrap {
	text-align: left;
	padding: 0% 1% 2.5%;
}
.newin-box-text-wrap h3 {
	font-size: 1.3vw;
	font-weight: 700;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}
.newin-box-text-wrap h4 {
	font-size: 1.1vw;
	font-weight: bold;
	padding: 1% 3%;
	letter-spacing: normal;
	line-height: normal;
}

.newin-box-text-wrap h5 {
	font-size: 1.1vw;
	font-weight: 400;
	padding: 1% 3%;
	color: #333333;
}

.newin-box-text-wrap p {
	font-size: 0.9vw;
	line-height: normal;
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	padding: 1% 3%;
}

.btn_newin:hover {
	background-color: #3c2e7e;
    /* background: linear-gradient(to left, #349cd7 0%,#976afd 40%,#ec5484 100%) !important; */
	border: 0px #3c2e7e solid;
	/* box-shadow: transparent 3px 3px 0px; */
}

/********************
02 11月每日小物
********************/
.november-bg{
	width: 100%;
	padding: 0% 0% 3%;
	background: url(../images/november-bk.jpg) center bottom no-repeat;
	background-color: #cb1c17;
	/* background: linear-gradient(to bottom, #916dda 5%,#ffc0d3 100%) !important;*/
	background-size: 100%;
}
.brandBox_nove {
	width: 100%;
	margin: 0%;
	padding: 0%;
}
.makeup-white {
    width: 91%;
    margin: 0% auto;
	padding: 1%;
	background-color: rgba(255, 255, 255, 0.4);
	border-radius: 32px;
}

div.gallery {
	margin: 5px;
	border: 1px solid #ccc;
	float: left;
	width: 180px;
  }
  
  div.gallery:hover {
	border: 1px solid #777;
  }
  
  div.gallery img {
	width: 100%;
	height: auto;
  }
  
  div.desc {
	padding: 15px;
	text-align: center;
  }

.calendar-white {
    width: 91%;
    margin: 0% 4.5%;
	padding: 0%;
	text-align: center;
	/* 
	background-image: url(../images/everyday/img-daily-green-BK1.png), url(../images/everyday/img-daily-green-BK2.png);
	background-repeat: no-repeat, no-repeat;
	background-position: left top, left bottom;
	background-color: rgba(255, 255, 255, 0.4);
	border-radius: 0px; 
	*/
}
.calendarBox1 {
	position: relative;
	width: 88%;
	margin: 0% 5% 0% 7%;
	/*
	display: flex;
	flex-wrap: nowrap; 
	justify-content: flex-end; 
	justify-content: space-evenly;
	box-sizing: border-box;*/
	padding-top: 16%;
	padding-bottom: 0%;
}
.calendarBox2 {
	position: relative;
	width: 88%;
	margin: 0% 5% 0% 7%;
	padding-top: 0%;
	padding-bottom: 0%;
}

/*
.calendarBox2 {
	position: relative;
	text-align: center;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-evenly;
	box-sizing: border-box;
	padding-top: 0%;
	padding-bottom: 0%;
}

.calendarBox1 a:hover,.calendarBox2 a:hover {

		transition: all .2s cubic-bezier(0, 0, 0.58, 0);
		-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}
*/

.calendar_content img, .calendar_content_w1 img {
    transform: scale(1);
	border-radius: 10px;
	border: 2px #d3a675 solid;
	width: 100%;
}

.calendar_content img:hover, .calendar_content_w1 img:hover {
	filter: saturate(1.2);
	border: 2px #fff solid;
	/* transform: scale(1.05);
	overflow: hidden; */
}


/*
.calendarBox1 img, .calendarBox2 img {
    transform: scale(1);
	border-radius: 8px;
	border: 2px #d3a675 solid;
}

.calendarBox1 img:hover, .calendarBox2 img:hover {
	filter: saturate(1.2);
	border: 2px #fff solid;
}
*/

.calendar_content_w1 {
	position: relative;
    margin: 1% 0.4% 0%;
    font-weight: 600;
	padding: 0% 0%;
	display: inline-block;
	width: 13%;
	/* -webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2)); 
    visibility: hidden;*/
}
.calendar_content {
	position: relative;
    margin: 1% 0.4% 0%;
    font-weight: 600;
	padding: 0% 2%;
	display: inline-block;
	/* -webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2)); 
    visibility: hidden;*/
}

.c_img_Hidden {
	visibility: hidden;
}

.calendar_content_H, .calendar_content_w1_H {
	position: relative;
    margin: 1% 0% 1.3%;
    font-weight: 600;
	padding: 0% 2%;
	visibility: hidden;
}

.calendar_content:hover {
	transform: scale(0.98);
}
.calendar_content h3{
	color: transparent;
	font-size:large
}
.calendarArea {     /*  .GiftArea   */
	position: relative;
	width: 100%;
	margin: 0%;
	/* display: flex;
	align-items: center;
	justify-content: center;
	*/
}

/* 11月 Calendar */
/********
.calendarArea:nth-child(1) {
	padding-top: 0%;
	padding-bottom: 0.5%;
	background-image: url(../images/everyday/title-November.png), url(../images/everyday/bn-Xmas-came-early.png), url(../images/everyday/img-daily-green-BK1.png);
    background-repeat: no-repeat, no-repeat, no-repeat;
	background-position: 30% 29%, 20% 99%, center top;
	background-size: 940px 90px, 900px 320px, 100%;
}
*********/
/* 12月 Calendar */
.calendarArea:nth-child(1) {
	padding-top: 0%;
	padding-bottom: 0.5%;
	background-image: url(../images/everyday/title-December.png), url(../images/everyday/bn-MerryXmas.png), url(../images/everyday/img-daily-green-BK1.png);
    background-repeat: no-repeat, no-repeat, no-repeat;
	background-position: 40% 29%, 40% 99%, center top;
	background-size: 970px 90px, 1120px 340px, 100%;
}
.calendarArea:nth-child(2),.calendarArea:nth-child(3),.calendarArea:nth-child(4) {
	padding-top: 0%;
	padding-bottom: 0.5%;
	background-image: url(../images/everyday/img-daily-green-BK3.png);
	background-repeat: repeat-y;
	background-position: center top;
	background-size: 100% 100%;
}
.calendarArea:nth-child(5) {
	/* padding-right: 11.6%; */
	padding-top: 0%;
	padding-bottom: 5%;
	background-image: url(../images/everyday/img-daily-green-BK2.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100%;
}

/********************
03 黑五精品
********************/
.blackfridaye-bg{
	width: 100%;
	padding: 3.5% 0% 7%;
	background: url(../images/BK-blackfriday.jpg) center top no-repeat;
	/* background: linear-gradient(to bottom, #916dda 5%,#ffc0d3 100%) !important;*/
	background-size: 100%;
	background-color: #2d7760;
}
.black5-box-wrap {
	text-align: center;
	width: 100%;
}
.black5-box-wrap ul {
	width: 80%;
	margin: 1% auto 0%;
}
.black5-box-wrap ul li {
	width: 22%;
	margin: 0% 1% 1%;
	position: relative;
	display: inline-table;
	text-align: center;
	color: #fff;
	padding: 0% 0% 0.5% 0%;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}
.black5-box-img-wrap img {
	width: 100%;
	position: relative;
	z-index: 1;
	border-radius: 8px;
	/* opacity: .9; */
}
.black5-box-img-wrap img:hover {
	filter: saturate(1.4);
	transform: scale(1.02);
	transition: all .2s linear;
}
.black5-box-text-wrap {
    position: absolute;
    text-align: center;
    padding: 0% 1% 2.5%;
    top: 4%;
    z-index: 2;
    width: 100%;
}
.black5-box-text-wrap h2 {
	font-size: 1.7vw;
    font-weight: 900;
    padding: 0% 0%;
	letter-spacing: 0px;
	text-transform: uppercase;
	
}
.btn_black5 {
	position: absolute;
    text-align: center;
    width: 100%;
    color: #fff;
    /* background: linear-gradient(to right, #349cd7 0%, #976afd 45%, #ec5484 100%) !important; */
    font-weight: 600;
    font-size: large;
	bottom: 6%;
    z-index: 2;
}
.btn_black5:hover {
    color: #000;
}

/********************
04 最後一檔瘋狂下殺 免稅折扣品懶人包
********************/
.lastSALE-bg{
	width: 100%;
	padding: 3.5% 0% 7%;
	background: url(../images/BK-last.jpg) center top no-repeat;
	/* background: linear-gradient(to bottom, #916dda 5%,#ffc0d3 100%) !important;*/
	background-size: 100%;
	background-color: #2d7760;
}
.brandBtnBox {
    width: 100%;
    text-align: center;
}

.brandBtn2 {
	font-size: large;
	font-weight: 600;
	text-align: center;
    background-color: #d41510;
	border: 2px solid #d41510;
	color:#ffffff;
    margin-top: 1%;
    padding: 0.5% 4%;
	display: inline-block;
	border-radius: 8px;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}
  
  .brandBtn2:hover {
	background-color: #ff0500;
	border: 2px solid white;
  }

/********************
04 美妝香水
********************/
.beauty-bg{
	width: 100%;
	padding: 3.5% 0% 6%;
	background: url(../images/BK-beauty.jpg) center top no-repeat;
	/* background: linear-gradient(to bottom, #916dda 5%,#ffc0d3 100%) !important;*/
	background-size: 100%;
}

/********************
07 周年慶美妝特賣
********************/
.dot_yellow {
    background: url(../images/dot_yellow.gif) 0% 0% repeat-x;
}


.skincare-box-wrap {
	text-align: center;
	width: 100%;
}
.skincare-bg{
	width: 100%;
	padding: 0% 0% 2.8%;
	background: url(../images/BK-selected2.jpg) center bottom no-repeat;
	/* background: linear-gradient(to bottom, #916dda 5%,#ffc0d3 100%) !important;*/
	background-size: 100%;
	margin-top: -6%;
	background-color: #a80204;
}
.skincare-img{
	width: 100%;
	padding: 0% 0% 2%;
	background: url(../images/BK-sale.png) 4% 52% no-repeat;
	/* background-size: cover; */
}
.skincare-box-wrap ul {
	width: 80%;
	margin: 0 auto;
}
.skincare-box-wrap ul li {
	width: 22%;
	margin: 1% 1% 0%;
	position: relative;
	display: inline-table;
	text-align: center;
	color: #fff;
	padding: 0%;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}
.skincare-box-img-wrap img {
	width: 100%;
	position: relative;
	z-index: 1;
	padding-bottom: 3%;
	border-radius: 16px;
	/* opacity: .9; */
}
.skincare-box-img-wrap img:hover {
	filter: saturate(1.4);
	transform: scale(1.02);
	transition: all .2s linear;
}
.gift-tag {
    position: absolute;
    z-index: 2;
	/* background: #4e74e4; 
	 background-image: linear-gradient(to right, #4f75e4, #7292e8);
	background-image: url(../images/red-tag.png);*/
    right: 20px;
	top: -10px;
	-webkit-filter: drop-shadow(4px 4px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(4px 4px 0px rgba(0, 0, 0, 0.2));
}

.gift-tag img{
	width:100%;
}

.discount-tag {
    position: absolute;
    z-index: 2;
    right: 3%;
	bottom: 20%;
}
.discount-tag2 {
    position: absolute;
    z-index: 2;
    right: 3%;
	bottom: 14%;
}
.discount-tag img, .discount-tag2 img {
	width:100%;
}

.skincare-box-wrap .btn-wrapper {
	margin: 10px auto;
}
.skincare-box-wrap ul a:hover .skincare-img-wrap img {
	opacity: 1;
	transition: all .2s linear;
}
.skincare-box-wrap ul a:hover .btn {
	background: #66b7d3; /* #c70000 */
	color: white;
	transition: all .2s linear;
}

.skincare-box-text-wrap {
	text-align: left;
	padding: 0% 1% 2.5%;
}
.skincare-box-text-wrap h3 {
	font-size: 1.3vw;
	font-weight: 700;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}
.skincare-box-text-wrap h4 {
	font-size: 1.1vw;
	font-weight: bold;
	padding: 1% 3%;
	color: #333333;
	letter-spacing: -1px;
}

.skincare-box-text-wrap h5 {
	font-size: 1.1vw;
	font-weight: 400;
	padding: 1% 3%;
	color: #333333;
}

.skincare-box-text-wrap p {
	font-size: 0.9vw;
	line-height: normal;
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	padding: 1% 3%;
}

.price_small {
	color:#555555;
	font-size: 0.9vw;
	font-weight: 400;
	padding-left: 0.5em;
	/* text-decoration: line-through; */
}
.price_large {
	color:#d20145;
	padding: 1% 2%;
}
.price_line {
	color:#555555;
	text-decoration: line-through;
}
.btn_skin {
    width: 92%;
	color: #fff;
	background-color: #3c2e7e;
    /* background: linear-gradient(to right, #349cd7 0%,#976afd 45%,#ec5484 100%) !important; */
    border: 2px #fff solid;
    margin: 0% 4%;
    font-weight: 600;
	font-size: large;
    padding: 3%;
}

.btn_skin:hover {
	background-color: #f87f9e;
    /* background: linear-gradient(to left, #349cd7 0%,#976afd 40%,#ec5484 100%) !important; */
	border: 2px #c51e43 solid;
	/* box-shadow: transparent 3px 3px 0px; */
}


/**** 10月萬聖 Halloween ****/

.pc_area {
	display: block;
}
.mob_area {
	display: none;
}

.item-box-wrap {
	position: relative;
	text-align: center;
}

.brandBox_item {
	width: 100%;
	margin: 0%;
	padding: 0%;
}

.item-purple {
    width: 80%;
    margin: 0% auto;
}

.item-purple img:hover {
	filter: saturate(1.4);
	transform: scale(1.02);
}

.item-bg {
	width: 100%;
	padding: 3% 0% 3%;
	background: url(../images/Halloween-bk.gif) top center no-repeat;
	background-size: cover;
}

.item_content {
	position: relative;
    margin: 0% 0% 0%;
	padding: 0%;
	display: inline-block;
	/* -webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2)); */
}
.item_content:nth-child(1) {
	width:22%;
	margin-right: 1%;
}
.item_content:nth-child(2) {
	width:42%;
	padding: 0% 0.5%;
}
.item_content:nth-child(3) {
	width:22%;
	margin-left: 1%;
}

.item_content1 {
	display: block;
	margin-bottom: 4%;
	filter: drop-shadow(6px 6px 2px rgba(0, 0, 0, 0.15));
}
.item_content1 img{
	width: 100%;
}



/* Big Sale */
.BigSale__area{
	width: 100%;
	padding: 2% 0% 2%;
	background:#916dda;
	background-image: url(../images/BK-50.png);
	background-repeat: no-repeat;
	background-position: -1% 10%;
	/* background-size: 161px 197px, 97px 207px; */
}
.BigSale-box-wrap {
	text-align: center;
	width: 100%;
	margin: 2% 0%;
}

/* 
.bk-BigSale-img {
	background-image: url(../images/monster-1_.png),url(../images/monster-2_.png) ;
	background-repeat: no-repeat, no-repeat;
	background-position: -6% 10%, 98% 0%;
}
*/
.saleArea {
	position: relative;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	/* background: linear-gradient(to top, #16203b 0%, #16203bc7 40%, #16203b00 100%); */
	margin-top: 1%;  /*-25% */
	padding-bottom: 1%;
}
.saleBox {
	position: relative;
	width: 78.5%;
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	box-sizing: border-box;
	padding-top: 0%;
}
.saleBox_row2 {
	width: 22.35%;
    margin: 0% 1.5% 0% 0%;
    padding: 0%;
	display: inline-block;
	/* 
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
	box-shadow: #f4de34 26px 27px 0px; */
}
.saleBox_row1 {
	width: 22.35%;
    margin: 0% 1.5% 0% 0%;
    padding: 0%;
	display: inline-block;
}
.saleBox_row3 {
	width: 22.35%;
    margin: 0% 1% 0% 0%;
    padding: 0%;
	display: inline-block;
}
.saleBox_product {
	position: relative;
	width: 46.5%;
    margin: 0% 1%;
	padding: 0%;
	display: inline-block;
}

.saleBox_product1 {
	position: relative;
	width: 100%;
    margin: 0%;
	padding: 0%;
	-webkit-filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(6px 6px 0px rgba(0, 0, 0, 0.2));
}

.out_radius1 img {
	border-radius: 48px 0px 0px 0px;
	border: 0px #666666 solid;
}
.out_radius2 img {
	border-radius: 0px 0px 0px 0px;
	border: 0px #666666 solid;
}
.out_radius3 img {
	border-radius: 0px 0px 48px 0px;
	border: 0px #666666 solid;
}

.saleBox_product img, .saleBox_product1 img {
	width: 100%;
}

.saleBox_product img:hover, .saleBox_product1 img:hover {
	transform: scale(0.98);
	transition: all .2s linear;
}

.m_bottom{
	margin-bottom: 3%;
}
.m_bottom_2{
	margin-bottom: 6%;
}
.m_bottom_6{
	margin-bottom: 7%;
}
.m_bottom_7{
	margin-bottom: 7%;
}


/*******************
event-hightlight wrap
*******************/

.highlight-event-box-wrap {
	text-align: center;
}
.highlight-event-box-wrap ul {
	width: 80%;
	margin: 0 auto;
}
.highlight-event-box-wrap ul li {
	width: 22%;
	margin: 2% 1%;
	display: inline-table;
	text-align: center;
	color: #337058;
	background-color: #eee;
	padding: 0.5%;
}
.highlight-event-box-img-wrap img {
	width: 100%;
	/* opacity: .9; */
}
.highlight-event-box-text-wrap h4 {
	font-size: 1.2vw;
	line-height: normal;
	font-weight: 600;
}

.highlight-event-box-text-wrap p {
	font-size: 1vw;
	line-height: normal;
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-weight: 600;
}
.highlight-event-box-content {
	line-height: normal;
}



.highlight-event-box-wrap .btn-wrapper {
	margin: 10px auto;
}
.highlight-event-box-wrap ul a:hover .event-box-img-wrap img {
	opacity: 1;
	transition: all .2s linear;
}
.highlight-event-box-wrap ul a:hover .btn {
	background: #66b7d3; /* #c70000 */
	color: white;
	transition: all .2s linear;
}
/*******************
pop-up
*******************/

/***** popup's controler *****/

.overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	transition: opacity 200ms;
	visibility: hidden;
	opacity: 0;
}
.overlay:target {
	visibility: visible;
	opacity: 1;
}
/***** popup's appearance *****/

/* Modal */

.pop-modal {
	background-color: rgba(0, 0, 0, .65);
	display: none;
	overflow: auto;
	position: fixed;
	z-index: 1000;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding-top: 10%;
}
/* Modal Content */

.modal-content {
	position: relative;
    top: 0px;
    width: 600px;
    margin: 0 auto;
    background-color: #434343;
    box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border: 2px solid #fff;
    border-radius: 0px;
}
.modal-animated-in {
	animation: totop-in .3s ease;
}
.modal-animated-out {
	animation: totop-out .3s ease forwards;
}
.modal-header {
	background-color: #cb1c17;  /*  #ffe33a  */
    width: 100%;
    height: 60px;
    line-height: 60px;
    padding-left: 20px;
}
.modal-content .close {
	position: absolute;
	right: 0;
	top: 0;
	/*  background-color: #111111; */
	color: #ffffff;
	width: 60px;
	height: 60px;
	
	line-height: 60px;
	text-align: center;
	cursor: pointer;
	transition: all .3s;
}
.modal-content .close:hover {
	background-color:#0d856c;
	color: #ffffff;
	/* color: #ffffff; */
	border-radius: 0px;
}
.modal-header h3 {
	color:#ffffff; /* #147e31;*/
	/* text-shadow: 1px 0px rgba(255, 255, 255, 1); */
	font-weight: bolder;
	font-size: 24px;
	text-align: left;
}
/* Modal Body */

.modal-body {
	padding: 20px 27px 20px 20px;
	line-height: 30px;
	font-size: 15px;
	color: #111111;
	background: linear-gradient(to bottom, #ffffff 0%,#ffffff 100%);
	border-radius: 0px;
}
.modal-body h3 {
	font-size: 18px;
}
.modal-body-inner {
	overflow-y: auto;
	height: 350px;
	padding: 0 30px 0 10px;
}
.modal-body-inner hr {
	width: 97%;
}
.modal-body-inner h3 {
	margin-bottom: 5px;
	text-align: center;
	/* color: #edff00; */
}
.modal-body-inner h4 {
    margin-bottom: 5px;
    text-align: center;
    /* color: #edff00; */
}

.modal-body-inner::-webkit-scrollbar-track {
	background-color: #9fd8cd;
}
.modal-body-inner::-webkit-scrollbar {
	width: 5px;
	background-color:white;
}
.modal-body-inner::-webkit-scrollbar-thumb {
	background-color: #cb1c17;
}
.modal-body ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.modal-body ul li {
	position: relative;
	margin-left: 30px;
	list-style-type: decimal-leading-zero;
	text-align: left;
}
.modal-body-text img{
	width:100%
}
.modal-body ul li ol {
	margin: 0;
	padding: 0;
	list-style: none;
}
.modal-body ul li ol li {
	/* list-style-type: decimal; */
	list-style-type: Lower-latin;
	position: relative;
	margin-left: 16px;
	/* ; 
	   content: '◆ ';*/
	text-align: left;
}
.taxi_coupon_cor{
	color: #cb1c17;
	font-weight: 600;
}
/*
.modal-body ul li::before {
	position: absolute;
	color: #5cc560;
	left: -20px;
	top: 10px;
	display: inline-block;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
}
*
.modal-body ul li img{
	width: 100%;
	height: auto;
}

/*
.modal-body a {
	color: #000000;
    text-decoration: underline;
    font-weight: 600;
    background-color: #f1506a;
    padding: 0 4px;
}

.modal-body a:hover {
	color: #ffffff;
	transition: all .2s linear;
}
*/

.modal-body-text-wrap {
	margin-bottom: 20px;
}
.modal-body-text {
	font-size: 15px;
}
.modal-body-text-wrap h5 {
	color:#111111; /* #edf395; */
	font-size: 1vw; /* 15px; */
	font-weight: 600;
	text-align: left;
}
.modal-body-text-special{
	color:#ffef9a;
}
.modal-body-text-wrap h6 {
	color: #999;
	font-size: 12px;
}

.modal-body-text p {
	text-align: left;
}


.modal-body h3 {
    font-size: 22px;
}
.modal-body h4 {
    font-size: 18px;
}

.modal-body p.LH {
	line-height: 130%;
	text-align: center;
	padding-top: 3%;
}

.btn__copyText img{
	margin-bottom: -5px;
	max-width: 4%;
}

.btn__copyText img:hover{
	filter: saturate(0.5);
}
.icon__taxi__popup{
	max-width: 80%;
	margin-left: 10%;
}
.btn2 {
    /* line-height: 40px; */
    padding: 1%;
    text-align: center;
}

.btn_popup {
    width: 32%;
    left: 18%;
    color: #fff;
    background: linear-gradient(to right, #4cafe7 0%,#ae8aff 40%,#ec5484 100%) !important;
    border: 2px #fff solid;
    margin: 5% 34%;
	/* 
	box-shadow: #000 3px 3px 3px;
	margin: auto 34%;  */
	font-weight: 600;
	font-size: large;
}

.btn_popup:hover {
    background: linear-gradient(to left, #4cafe7 0%,#ae8aff 40%,#ec5484 100%) !important;
	color: #fff !important;
	border: 2px #89fbfd solid;
	box-shadow: transparent 3px 3px 0px;
}

.f-h3-b {
    text-decoration: underline;
    color: #e14779;
    font-weight: bold;
    font-size: 1.2vw;
}

.btn_popup a{
    color: #fff;
    text-decoration: none;
}

/* Modal Footer */

.modal-footer {
	background-color: #656464;
	width: 100%;
	height: 60px;
	line-height: 60px;
	padding-left: 20px;
}
/*sidenav*/

.menu {
	position: fixed;
	z-index: 29;
}
.menu__style {
	background-color: #ffe396;
    text-align: center;
    border: 2px #ffffff solid;
    box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.menu ul li {
    font-weight: bold;
    color: #006d5a;
    display: inline-block;
    border-bottom: 1px dotted #d60f08;
    line-height: 2.2em;
    width: 100%;
}

.menu ul li:hover {
	color: #d60f08;
	/*#ffef07; */
}
/* hide sidenav 黏人精*/

#sidebar {
	transition: all 300ms linear;
}
#sidebar.active {
	right: -800px;
	/* -200px */
}
#sidebar .toggle-btn {
	position: fixed;
	/* position:absolute; */
	right: 0px;
	/* 220px */
	/* top:50px; */
	/* box-shadow: 2px 2px 2px 1px rgba(252, 93, 174, 0.3); */
	cursor: pointer;
    background-color: #337058;
    border: 3px #fff solid;
}

#sidebar .toggle-btn:hover {
    background-color: #d60f08;
}
/* 收合導覽黏人精*/

#sidebar .toggle-btn span {
    display: block;
    width: 30px;
    height: auto;
    color: #fff;
    font-weight: 600;
    margin: 0px 0px;
    padding: 6px 0;
    text-align: center;
    cursor: pointer;
}
/*toTop*/

.toTop-arrow {
	width: 50px;
	height: 50px;
	border: 0;
	border-radius: 50%;
	opacity: 0.9;
	background: #d60f08;
    color: #ffffff;
    cursor: pointer;
    position: fixed;
    right: 10px;
    bottom: 10px;
    padding-top: 5px;
    z-index: 999;
	border: 2px #ffffff solid;
	font-weight: bold;
}
.toTop-arrow::before, .toTop-arrow::after {
	width: 8px;
	height: 3px;
	border-radius: 5px;
	top: 10px;
	background: #ffffff;
	position: absolute;
	content: "";
}
.toTop-arrow::before {
	transform: rotate(-45deg) translate(0, -50%);
	left: 1.1rem;
}
.toTop-arrow::after {
	transform: rotate(45deg) translate(0, -50%);
	right: 1.1rem;
}
.toTop-arrow:focus {
	outline: none;
}


/* scroll Menu */

#section-menu {
	position: fixed;
	top: 40%;
	right: 0;
	z-index: 3000;
	text-transform: uppercase;
	-webkit-transition: all ease 0.1s;
	transition: all ease 0.1s;
}
#section-menu.freeze {
	right: -112px;
}
.touch #section-menu {
	display: none;
}
#section-menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#section-menu a {
	float: right;
	clear: both;
	display: block;
	height: 2em;
    line-height: 2em;
    font-weight: 600;
	text-decoration: none;
	padding: 0 16px;
	background: #0101a1; /* #1212eed1; */
	color: #ffea06eb; /* #ffea06eb; */
	white-space: nowrap;
	-webkit-transition: all ease 0.1s;
	transition: all ease 0.1s;
}
#section-menu.freeze a {
	float: none;
	width: 128px;
}
#section-menu a:hover{
    background: #04041fd7; /*  */
    color: #fff;
	font-size: 1.2em;
}
#section-menu a span {
	display: none;
	font-weight: 700;
	position: relative;
	width: 48px;
	left: -16px;
	text-align: center;
	background: rgba(0,0,0,0.1); /* #fafd4a*/
}
#section-menu a.active {
    background:#428152; /* #fff821; */
    font-size: 1.2em;
    font-weight: 700;
    color:#fff; /* #fff821; */
}
#section-menu.freeze a span {
	display: inline-block;
}
#section-menu a.active span {
	display: inline-block;
    background:#12772b; /* 040493 #000; */
    color:#fff821; /* #ffff0b; */
}
#section-menu a.active span:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	background: rgba(255,255,255,0.25);
}
#section-menu.freeze a.active span:before {
	display: none;
}