/**思源宋體**/

@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%;
	background-color: #eaeaea;
	/* cursor: pointer;
	cursor: url(../images/lenmon-cursor.cur) 4 12, pointer;	 */
}

.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-gray {
	background-color: #f4d86a;
}

.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: #009bbb !important;
    color: #fff !important;
    border: 2px #009bbb solid;
	padding: 2px;
}
.btn-yellow:hover{
	background-color: #fff !important;
	color: #009bbb !important;
	border: 2px #009bbb 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-black-Yellow{
	background-color: #000!important;
	border: 2px #fff400 solid;
    color: #fff400!important;
    border-radius: 0px;
    /* box-shadow: #000 3px 3px 0px; */
    font-weight: 600;
    font-size: large;
}

.btn-black-Yellow:hover{
	background-color: #fff400 !important;
	color: #000 !important;
	border: 2px #fff400 solid;
	box-shadow: transparent 3px 3px 0px;
}

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

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

.btn-pink-info{
	padding: 4% 2%;
	color: #111111 !important;
	font-size: large;
	text-decoration: underline;
}
.btn-pink-info:hover{
	color: #333 !important;
	text-decoration: none;
}

.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-more{
	background-color: #e6c804 !important;
	color: black !important;
	padding: 8px 6px;
}
.btn-more:hover{
	background-color: #b8251c !important;
	filter: invert(1);
}

/*font color*/
.text_black {
	color: #000000;
}
.text_grey {
	color: #666666;
}
.text_gray_c {
	color: #fff9e4;
}
.text_white {
	color: #fff;
}
.text_light_grey {
	color: rgb(238, 235, 235);
}
.text_pink{
	color:#fe3c93;  /*  #fe3c93   */
}

.text_purple{
	color: #8a2dfe;  
}

.text_blue{
	color: #401eff;
}

.text_yellow_lite {
	color: #ffef5c;
	font-weight: bold;
}
.text_green{
	color: #4e9d72;
}

.text_red{
	color: #da4633;
}
.text_darkred{
	color: #920117;
}

.text_snack_info{
	color: #2c2b15;
}

.discountBox_title__color{
	color:#c1251a;
}
.text_yellow{
	color:#f7db6d;
}
.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: 2.4vw;
	font-weight: bold;
	/* filter: drop-shadow(0px 0px 3px #ff425a); */
	line-height: normal;
}
.f4_p {
	font-size: 2vw;
	font-weight: bold;
}
.f4_r {
	font-size: 1.6vw;
	letter-spacing: 1px;
}
.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: 1.1vw;
	font-weight: normal;
	letter-spacing: 1px;
	line-height: normal;
}
.f6_g {
	font-size: 1.1vw;
	font-weight: bold;
	letter-spacing: 1px;
	line-height: normal;
}
.f7 {
	font-size: 0.8vw;
}
.f_dec_line {
	text-decoration: underline;
}

.tag_yellow {
    background-color: #ffe248;
    width: 30%;
    margin: 0% 35% 3%;
    color: #4021ff;
    border-radius: 24px;
}

.btn-wrapper {
	display: block;
	margin-bottom: 8%;
	/* 
	width: 80%;
	margin: 4% 10% 1% 10%; */
}
.btn-wrap {
	width: 50%;  
	display: inline-block;
}
.btn-7-11 {
	margin-left: -14%;
}
.btn-download {
	margin-top: 8%;
}
.btn-wrap2 {
	width: 100%;
    margin: 6% auto 1%;
}
.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: 6% 6%;
	text-align: center;
	font-weight: 600;
	font-size: large;
}

.btn-darkblue {
    background-color: #111111 !important;
    color: white !important;
	border: 2px #111111 solid;
	border-radius: 0px 0px 24px 0px;
}

.btn-darkblue:hover {
    background-color: #059db9 !important;
    color: #ffffff !important;
    border: 2px #0098bc solid;
	border-radius: 24px 0px 0px 0px;
	transition: all 0.3s linear;
    /* filter: invert(1); */
}

.btn-whiteblue {
	background-color: #111111 !important;
    color: #ffffff !important;
    border: 2px #111 solid;
    border-radius: 0px 0px 24px 0px;
}

.btn-whiteblue:hover {
	background-color: transparent !important;
	color: #111 !important;
	border: 2px  #111111 solid;
	border-radius: 24px 0px 0px 0px;
	transition: all 0.3s linear;
    /* filter: invert(1); */
}

.btn-lucky {
    padding: 2% 2%;
    text-align: center;
    font-weight: 600;
	width: 36%;
    display: inline-block;
	margin: 0% 2%;
	font-size: large;
}

.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;
	text-decoration: underline;
	font-size: large;
}

.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;
}

.content-text1 {
	font-size: 1.4vw;
	font-weight: bold;
	line-height: normal;
}

/* 7-ELEVEN & LINE Pay */
.discount2-bg{
	background-image: url(../images/wave-icon-blue.gif);
	background-repeat: repeat-x;
	background-color: #f4d86a;
	background-position: left bottom;
}

.discount2__area{
	width: 100%;
	padding: 1% 0% 3% 0%;
	/* background-image: url(../images/wave-icon-blue.gif);
	background-repeat: repeat-x;
	background-color: #f4d86a;
	background-position: left bottom; */
}

.sevenBox_default {
    position: relative;
    margin: 0% 1%;
    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));
}
.sevenBox_default img{
	margin: 7px 0px;
}

.seven-box-bk {
	width: 50%;
    text-align: center;
    height: auto;
    padding: 0%;
    position: absolute;
    z-index: 3;
    right: 50%;
    list-style-type: none;
    bottom: 10%;
}

.btn-wrapper711 {
	width: 50%;
    margin: 3% auto 1%;
    display: block;
}

/* ------ SNOOPY Gifts ----- */

.gift__area{
	width: 100%;
	padding: 2% 2% 2% 2%;
	background-color: #009bbb;
	background-image: url(../images/bk-snoopy.gif);
	background-size: cover;
}

.bk-discount-row {
	background: linear-gradient(to bottom, #ffcfd9 0%, #ffcfd9 95%);
}

.snoopyArea {
	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: 1%;
}
.SnoopyBox {
	position: relative;
	width: 80%; /* 80% */
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	box-sizing: border-box;
	padding-top: 0%;
}

.SnoopyBox_default_row2, .everrichBox {
    position: relative;
    width: 47%;
    margin: 0% 1%;
    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; */
}
.snoopy-box-bk_row2-1 {
    width: 55%;
    text-align: center;
    height: auto;
    padding: 5% 0% 2%;
    border: 0px #333 solid;
    position: absolute;
    z-index: 3;
    right: 8%;
    list-style-type: none;
    bottom: 4%;
}

.snoopy-box-bk_row2-2 {
    width: 55%;
    text-align: center;
    height: auto;
    padding: 5% 0% 2%;
    border: 0px #333 solid;
    position: absolute;
    z-index: 3;
    right: 22.5%;
    list-style-type: none;
    bottom: 4%;
}

.SnoopyBox_default_row2 img{
	margin: 7px 0px;
}

.btn-wrapper2 {
	width: 46%;
    margin: 4% auto 1%;
    display: block;
}
.w42 {
	width: 42%;
	margin-right: 4%;
}
.w36 {
	width: 36%; 
}
.btn-snoopy {
	padding: 5% 2%;
    text-align: center;
	font-size: large;
	font-weight: 600;
}
.btn-wrap-s {
    width: 100%;
    margin: 4% auto 1%;
}

.everrichBox img {
	width: 100%;
	margin: 7px 0px;
}

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

/* ------ SkinCare QQ ----- */
.skincare__area{
	width: 100%;
	padding: 2% 0% 2%;
	background-color: #d9ccb1;
	background-image: url(../images/bk-skincare.gif);
	background-size: cover;
	/* 	
	background: linear-gradient(to top, #021c8c 0%, #051773 40%, #081457 100%);
	background-color: #06227a; */
}
.skincare__snow{
	width: 100%;
	padding: 0%;
	background-image: url(../images/bk-skincare.gif);
	background-repeat: repeat-x;
	/* background: linear-gradient(to top, #021c8c 0%, #051773 40%, #081457 100%); */
}
.skincare_bk_gradient {
	background: linear-gradient(to top, #021c8c 0%, #051773 40%, #081457 100%);
}

.skincareArea {
	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: 0%;  /*-25% */
	padding-bottom: 1%;
}
.skincareBox {
	position: relative;
	width: 80%; /* 80% */
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	box-sizing: border-box;
	padding-top: 0%;
}
.skincareBox_row2 {
	position: relative;
	width: 48%;
    margin: 0% 0.5%;
	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; */
}
.skincareBox_row1 {
	width: 22.35%;
    margin: 0% 0.5% 0% 0%;
    padding: 0%;
	display: inline-block;
}
.skincareBox_row3 {
	width: 22.35%;
    margin: 0% 1% 0% 0%;
    padding: 0%;
	display: inline-block;
}
.skincareBox_product {
	position: relative;
	width: 46.5%;
    margin: 0% 1%;
	padding: 0%;
	display: inline-block;
}

.skincareBox_product1 {
	position: relative;
	width: 100%;
    margin: 0%;
    padding: 0%;
}
.skincareBox_product img, .skincareBox_product1 img {
	width: 100%;
}

.skincareBox_product img:hover, .skincareBox_product1 img:hover {
	transform: scale(0.98);
	transition: all .2s linear;
	-webkit-filter: drop-shadow(4px 4px 4px rgba(255, 255, 255, 0.8));
	filter: drop-shadow(4px 4px 4px rgba(255, 255, 255, 0.8));
}

/* ------ X'mas ----- */
.xmas__area{
	width: 100%;
	padding: 2% 0% 2%;
	background-color: #f1e1c3;
	background-image: url(../images/bk-boutique.gif);
	background-size: cover;
	/* 	
	background: linear-gradient(to top, #021c8c 0%, #051773 40%, #081457 100%);
	background-color: #06227a; */
}
.xmas__snow{
	width: 100%;
	padding: 0%;
	background-image: url(../images/snow-icon.png);
	background-repeat: repeat-x;
	/* background: linear-gradient(to top, #021c8c 0%, #051773 40%, #081457 100%); */
}
.bk_gradient {
	background: linear-gradient(to top, #021c8c 0%, #051773 40%, #081457 100%);
}

.xmasArea {
	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: 0%;  /*-25% */
	padding-bottom: 1%;
}
.xmasBox {
	position: relative;
	width: 80%; /* 80% */
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	box-sizing: border-box;
	padding-top: 0%;
}
.xmasBox_row2 {
	position: relative;
	width: 48%;
    margin: 0% 0.5%;
	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; */
}
.xmasBox_row1 {
	width: 22.35%;
    margin: 0% 0.5% 0% 0%;
    padding: 0%;
	display: inline-block;
}
.xmasBox_row3 {
	width: 22.35%;
    margin: 0% 0% 0% 1%;
    padding: 0%;
	display: inline-block;
}
.xmasBox_product {
	position: relative;
	width: 46.5%;
    margin: 0% 1%;
	padding: 0%;
	display: inline-block;
}

.xmasBox_product1 {
	position: relative;
	width: 100%;
    margin: 0%;
    padding: 0%;
}
.xmasBox_product img, .xmasBox_product1 img {
	width: 100%;
}

.xmasBox_product img:hover, .xmasBox_product1 img:hover {
	transform: scale(0.98);
	transition: all .2s linear;
	-webkit-filter: drop-shadow(4px 4px 4px rgba(255, 255, 255, 0.8));
	filter: drop-shadow(4px 4px 4px rgba(255, 255, 255, 0.8));
}

/* 秋冬保養買一送多 */
.skin__area{
	width: 100%;
	padding: 2% 0% 2%;
	background-color: #dcdcdc; 
}
.skin__snow{
	width: 100%;
	padding: 0%;
	background-image: url(../images/snow-icon.png);
	/* background: linear-gradient(to top, #021c8c 0%, #051773 40%, #081457 100%); */

	/* 	background-color: #06227a; */
    background-repeat: repeat-x;
}
.bk_gradient {
	background: linear-gradient(to top, #021c8c 0%, #051773 40%, #081457 100%);
}

.skinArea {
	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: 0%;  /*-25% */
	padding-bottom: 1%;
}
.skinBox {
	position: relative;
	width: 75%; /* 80% */
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	box-sizing: border-box;
	padding-top: 0%;
}
.skinBox_row2 {
	position: relative;
	width: 50%;
    margin: 0%;
	padding: 0%;
	display: inline-block;
}
.skinBox_row1 {
	width: 22.35%;
    margin: 0% 0.5% 0% 0%;
    padding: 0%;
	display: inline-block;
}
.skinBox_row3 {
	width: 22.35%;
    margin: 0% 0% 0% 1%;
    padding: 0%;
	display: inline-block;
}
.skinBox_product {
	position: relative;
	width: 47.4%;
    margin: 0% 1%;
	padding: 0%;
	display: inline-block;
}

.skinBox_product img {
	width: 100%;
}

.skinBox_product img:hover {
	transform: scale(0.98);
	transition: all .2s linear;
	-webkit-filter: drop-shadow(4px 4px 4px rgba(68, 250, 195, 0.8));
	filter: drop-shadow(4px 4px 4px rgba(68, 250, 195, 0.8));
}

.img-radius{
	border-radius: 36px 36px 0px 0px;
	-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));
}

/*  Designer Sale */
.DesignerSale__area{
	width: 100%;
	padding: 2% 0% 0%;
	background: url(../images/wave-red.jpg) repeat-x top left #f13842;
}

.bk-DesignerSale-img {
	background-image: url(../images/bk-bags.gif);
	background-size: cover;
	/* background-position: center bottom;
	background-repeat: no-repeat; */
}
.DesignerArea {
	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: 0%;  /*-25% */
	padding-bottom: 3%;
}
.DesignerBox {
	position: relative;
	width: 78.5%;
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	box-sizing: border-box;
	padding-top: 0%;
}
.DesignerBox_row2 {
	width: 22.35%;
    margin: 0% 1% 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; */
}
.DesignerBox_row1 {
	width: 22.35%;
    margin: 0% 1% 0% 0%;
    padding: 0%;
	display: inline-block;
}
.DesignerBox_row3 {
	width: 22.35%;
    margin: -1.5% 0% 0% 0%;
    padding: 0%;
	display: inline-block;
}
.DesignerBox_product {
	position: relative;
	width: 46.5%;
    margin: 0% 1%;
	padding: 0%;
	display: inline-block;
}

.DesignerBox_product1 {
	position: relative;
	width: 100%;
    margin: 0%;
    padding: 0%;
}

.DesignerBox_product img, .DesignerBox_product1 img {
	width: 100%;
}

.DesignerBox_product img:hover, .DesignerBox_product1 img:hover {
	transform: scale(0.98);
	transition: all .2s linear;
	-webkit-filter: drop-shadow(5px 5px 4px rgba(0, 0, 0, 0.4));
	filter: drop-shadow(5px 5px 4px rgba(0, 0, 0, 0.4));
}

/* Big Sale */
.BigSale__area{
	width: 100%;
	padding: 2% 0% 2%;
	background: url(../images/bk-sports.gif);
	background-size: cover;
	background-color: #f7db6d;
}

/* 
.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: 0%;  /*-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% 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% 0% 0%;
    padding: 0%;
	display: inline-block;
}
.saleBox_row3 {
	width: 22.35%;
    margin: -1.5% 0% 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%;
}

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

.saleBox_product img:hover, .saleBox_product1 img:hover {
	transform: scale(0.98);
	transition: all .2s linear;
	-webkit-filter: drop-shadow(5px 5px 4px rgba(0, 0, 0, 0.4));
	filter: drop-shadow(5px 5px 4px rgba(0, 0, 0, 0.4));
}

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



/* 免運區  */
.coupon_area {
	background-image: url(../images/discount-BK.png);
	background-repeat: no-repeat;
	background-position: top center;
    /* background: linear-gradient(to bottom, #332fb4 5%, #fdfcff 100%); */
	margin-top: -11.5%;
	position: relative;
    z-index: 2;
}
.coupon_L{
	margin-left: 131px;	
}

.GameBox {
    position: relative;
    width: 68%;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    box-sizing: border-box;
	padding-top: 0%;
	margin: -4% 15% 0% 17%;
	/* margin: -2% auto; */
    padding-bottom: 4%;
}
.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: -80% 0% auto 0%;
    /* margin: 62% auto auto -58%; */
}
.game_inner {
    position: absolute;
    z-index: 1;
	margin: 3.1% 19.5%;
	width: 59.9%;
	/*  margin: 4% 24%;  */
}
.game_pointer {
	position: absolute;
    z-index: 2;
    width: 68.2%;
    margin: -2% 15.4%;
}
.game_bt {
    position: absolute;
    z-index: 3;
    width: 6%;
    margin: -14.5% auto auto 8.5%;
}
.game_btn {
    position: absolute;
    z-index: 3;
	width: 22.9%;
    margin: 21% 38.1%;
	/*  margin: 20% 40.1%;  */
}

.game_FS {
    width: 95.4%;
    margin-bottom: 15px;
}

.game_info {
	position: absolute;
    z-index: 4;
    width: 60%;
    margin: 60% 20% 0%;
}

/*  旅行推薦  travel  */
.travel__area {
    width: 100%;
	padding: 2% 0% 0%;
	background-color: #f1f1f1;
}
.occasion-content {
	display: inline-block;
	width: 74%;
	padding-left: 2%;
}

.event-wrap {
    background: #fff;
    width: 100%;
    height: 100%;
}

.occasion-wrap {
    background: #f1f1f1;
    text-align: center;
}

.occasion-wrap ul {
    width: 75%;
    margin: 10px auto 0%;
    padding-bottom: 2%;
}

.occasion-wrap ul li {
    display: inline-table;
    padding: 0px;
    margin: 8px 8px 12px;
    position: relative;
	width: 31%;
}
.occasion-wrap ul a:hover li {
    background: #fefefe;
    transition: all .2s cubic-bezier(0, 0, 0.58, 0);
}

.occasion {
	background-color: #fff;
	-webkit-filter: drop-shadow(6px 6px 0px #cccccc);
    /* Safari */
    filter: drop-shadow(6px 6px 0px #cccccc);
}
a:hover .occasion {
	background-color: #f6f6f6;
	-webkit-filter: drop-shadow(6px 6px 0px #f6f6f6);
    /* Safari */
    filter: drop-shadow(6px 6px 0px #f6f6f6);
}
.sale-box {
    position: absolute;
    z-index: 2;
    background-image: linear-gradient(to right, #401eff ,#2c09ee);
	width: 9%;
    right: -6px;
    top: 32px;
    height: auto;
}

.tag_blue {
    font-size: 1.3vw;
    color: #fff;
    text-align: center;
    padding: 3% 2% 3% 1.5%;
    letter-spacing: 0px;
    font-weight: 500;
    line-height: 1.8rem;
}

.occasion-wrap ul a:hover li {
    background: #f9f9f9;
    transition: all .2s cubic-bezier(0, 0, 0.58, 0);
}

.occasion-wrap ul li img:hover {
    background: #f9f9f9;
    transition: all .2s cubic-bezier(0, 0, 0.58, 0);
    -webkit-filter: drop-shadow(6px 6px 0px transparent);
    /* Safari */
    filter: drop-shadow(6px 6px 0px transparent);
    transform: scale(1.05);
}

.occasion-img {
    margin-top: 0%;
    bottom: 0px;
}

.occasion-wrap ul li .occasion-img {
    overflow: hidden; 
}

.text-L-24{
    text-align: left;
    padding: 0 20px;
}


.title2 {
    /*** 如果讀不到思源宋體，用回微軟正黑體 ***/
    /* font-family: futura-pt, Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei"; 
    font-size: 30px;
    */
    font-family: 'Crimson Text', Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei";
    font-weight: 600;
    font-size: 1.8vw;
    line-height: 32px;
	text-transform: uppercase;
}

.occasion-title {
    margin: 10px auto 0;
}

.o-content-text {
    font-family: Helvetica, Arial, sans-serif, "微軟正黑體", "Microsoft JhengHei";
    font-size: 1.3vw;
    font-weight: 400;
    text-transform: uppercase;
    padding: 2% 0% 4%;
}

/*
.occasion {
    background-color: #fff;
    -webkit-filter: drop-shadow(6px 6px 0px #cccccc);
    filter: drop-shadow(6px 6px 0px #cccccc);
} */
.btn-travel {
	width: 24%;
	padding-right: 2%;
	display: inline-block;
}
a:hover .btn-white {
    background: #fff400;
    color: #fff;
	border: thin solid #401eff;
	color: #401eff;
}
.btn-white {
    background: #000;
    color: #fff;
	order: thin solid #838383;
}
.btn-whit a:hover {
    background: tr;
    color: #fff;
	border: thin solid #401eff;
	color: #401eff;
}
.btn {
	line-height: 36px;
    text-align: center;
    font-size: large;
}


/* 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-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";*/
}
a {
	color: #5d656c;
	text-decoration: none;
}
/*kv*/

.kv_wrapper {
	width: 100%;
}
.kv {
	display: block;
}
.mkv {
	display: none;
}


/* switch */

.switch-1 {
	display: none;
}
.mswitch-1 {
	display: none;
}

.switch-2 {
	display: block;
}
.mswitch-2 {
	display: none;
}


/* 邊框動畫效果 */

.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;
} */

.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%;
}

.bk-TS-img {
    background: linear-gradient(to bottom, #9d0117 0%, #9d0117 100%);
}

.TS-Area {
	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%;
}

.title-TS img {
	margin: -7% 0 -1% 0; /* 2% 0 1% 0;*/
	max-height: 100%;
	width: auto;
	height: auto;
}
.discountBox-TS {
    position: relative;
    width: 80%;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    box-sizing: border-box;
}

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

.discountBox-TS ul li {
    list-style: none;
}
.discountBox-TS ul li img {
	width: 80%;
    margin-top: -23%;
    position: absolute;
    left: 36px;
}

.discountBox-TS ul p img {
	width: 18%;
    vertical-align: middle;
    padding: 0 1%;
}

/*discount*/
.event-box-wrap-row1 {
    position: relative;
	text-align: center;
	/* height: 460px; */
    padding-top: 2%;
}

.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%); */
	margin-top: -12.5%;  /*-25% */
	padding-bottom: 0%;
}
.Gift4H {
	width: 80%;
    margin: 0 auto;
    padding-bottom: 2%;
}


.main-box-bk {
	text-align: center;
    width: 100%;
	height: auto;
	margin: 62% 0% 0%;
	border: 0px #fff solid;
	position: absolute;
	z-index: 1;
	left: 0%;
    /* bottom: 12%; */
}

.mar-top-odd {
	margin: 66% 0% 0%;
}
.mar-top-even {
	margin: 33% 0% 0%;
}

.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: 86%;
    text-align: center;
    height: auto;
    padding: 3% 1.5%;
    border: 0px #fff solid;
    /* position: absolute; */
    z-index: 3;
	left: 40%;
	list-style-type: none;
}

.main-box-bk_row2-2 img .img-yoxi{
	/* width: 50%; */
	display: inline;
}
ul.main-box-bk_row2-2 li{
	margin: 0% auto;
	list-style: none;
}
ul.GameTxt li {
    margin: 0% auto;
	list-style: none;
	padding: 2%;
}

.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;
}
.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-Black5-img {
	background: linear-gradient(to bottom, #000000 0%, #222222 31%, #525252 72%, #525252 100%);
}

.bk-discount-row {
	background: linear-gradient(to bottom, #fdfcff 0%, #eae0ff 95%);
}

.bk-discount-row2 {
	background: linear-gradient(to bottom, #da4633 0%, #da4633 100%);
}

.bk-boutique-img {
	background: linear-gradient(to bottom, #000000 0%, #525252 100%);
}

.bk-skincare-img {
	background: linear-gradient(to bottom, #000000 0%, #222222 100%);
}

.bk-gift4Him-img {
	background: linear-gradient(to top, #f13842 0%, #f13842 40%, #f13842 100%);
	/* background: linear-gradient(to bottom, #564ff5 0%, #9990f9 58%, #bbaeff 100%); */
}
.bk-gift4Him-img2 {
	background-image: url(../images/GiftForHim-Small.png),url(../images/GiftForHim-Large.png) ;
	background-repeat: no-repeat, no-repeat;
	background-position: -3% 90%, 107% -57%;
}
.bk-gift4Her-img {
	background: linear-gradient(to bottom, #ffa4d7 0%, #fd84ca 58%, #fe3c93 95%);
}
.bk-gift4Her-img2 {
	background-image: url(../images/GiftForHer-Large.png),url(../images/GiftForHer-Small.png) ;
	background-repeat: no-repeat, no-repeat;
	background-position: -3% 90%, 107% -57%;
}
.bk-brand-img {
	background-color: #009bbb;
	/* background: linear-gradient(to bottom, #ffe248 0%, #ffe248 25%, #ffe248 50%, #ffe248 75%, #ffe248 100%); */
}

.bk-makeup-img {
	background-image: url(../images/makeup-x.png),url(../images/makeup-1-bk.jpg) ;
	background-repeat: repeat-x, repeat;
	background-position: left top, left top;
}

.bk-makeup-img2 {
	background-image: url(../images/makeup-left.png),url(../images/makeup-right.png) ;
	background-repeat: no-repeat, no-repeat;
	background-position: 0% 25%, right top;
}

.bk-musthave-img {
	background-image: url(../images/musthave-1-bk.jpg) ;
	background-repeat: repeat-x;
	background-position: left top;
}

.bk-snack-img {
	background-image: url(../images/spring-gold.png),url(../images/snack-1-bk.jpg) ;
	background-repeat: no-repeat, repeat;
	background-position: left top, left top;
}

.bk-gift-img {
	background-image: url(../images/yellow-heart.jpg);
    background-repeat: no-repeat;
	background-color: #ffdf6a;
	background-position: left top;
}

.bk-food-img {
	background-image: url(../images/food-bk.jpg);
    background-repeat: no-repeat;
	background-color: #ffdf6a;
	background-position: left top;
}

.bk-gift-icon1 {
	background-image: url(../images/bk-icon/icon-gift1.png),url(../images/title-gift-bk.gif);
	background-repeat: no-repeat, repeat-x;
	background-position: 4% 8%, left top;
	/* background: linear-gradient(to bottom, #000000 0%, #222222 31%, #525252 72%, #525252 100%); */
	background-color: #da4633;
}

.bk-gift-icon2 {
	background-image: url(../images/bk-icon/icon-gift4.gif), url(../images/bk-icon/icon-gift3.png);
	background-repeat: no-repeat, no-repeat;
	background-position: 1% 70%, 103% 1%;
	background-color: #da4633;
}

.bk-boutique-icon1 {
	background-image: url(../images/bk-icon/icon-butique1.gif),url(../images/bk-icon/icon-butique2.gif);
	background-repeat: no-repeat, no-repeat;
	background-position: 6% 8%, 92% 2%;
	background-color: #9fd1f2;
}

.bk-boutique-icon2 {
	background-image: url(../images/bk-icon/icon-butique4.gif), url(../images/bk-icon/icon-butique3.gif);
	background-repeat: no-repeat, no-repeat;
	background-position: -1.5% 90%, 96% 65%;
}

.bk-makeup-icon1 {
	background-image: url(../images/bk-icon/icon-makeup1.gif),url(../images/bk-icon/icon-makeup2.gif);
	background-repeat: no-repeat, no-repeat;
	background-position: -1% 7%, 97% 18%;
	background-color: #2b8fc1;
}

.bk-makeup-icon2 {
	background-image: url(../images/bk-icon/icon-makeup4.gif), url(../images/bk-icon/icon-makeup3.gif);
	background-repeat: no-repeat, no-repeat;
	background-position: 1.5% 60%, 96% 90%;
}

.bk-summer-icon1 {
	background-image: url(../images/bk-icon/icon-summer1.gif),url(../images/bk-icon/icon-summer2.gif);
	background-repeat: no-repeat, no-repeat;
	background-position: -4% 18%, 99% 25%;
	background-color: #ffe100;
}

.bk-summer-icon2 {
	background-image: url(../images/bk-icon/icon-summer4.gif), url(../images/bk-icon/icon-summer3.gif);
	background-repeat: no-repeat, no-repeat;
	background-position: 6.5% 90%, 97% 90%;
}


.bk-brandhighlights-img {
	background: linear-gradient(to bottom, #da4733 0%, #da4733 100%);
}

.bk-event-img {
	background-image: url(../images/makeup-x.png),url(../images/makeup-1-bk.jpg) ;
	background-repeat: repeat-x, repeat;
	background-position: left top, left top;
}

.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.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;
}

/***********************************
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: #fdff08 !important;
    color: #fe3c93 !important;
    border: 2px #fdff08 solid;
    font-weight: bold;
    padding: 2%;
    width: 36%;
    margin: 2% 32%;
    font-size: 1vw;
    border-radius: 0px;
}

.btn-pink3:hover {
	background-color: transparent !important;
    color:#fdff08 !important;
    border: 2px#fdff08 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: 74%;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding-top: 0%;
    justify-content: space-evenly;
    margin: 0 auto;
}
.discountBox2 {
	position: relative;
    width: 73%;
    text-align: center;
    display: flex;
    /* flex-wrap: wrap; */
    box-sizing: border-box;
    padding-top: 0%;
    justify-content: space-evenly;
    margin: 0 auto;
}

.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_L {
	width: 49%; /* 80% */
}

/* .discountBox::before{
	content: "";
	display: block;
	position: absolute;
	right: 5%;
	bottom: 5%;
	background-color: #F4DE34;
} */
.discountBox ul li {
	list-style: none;
}
.discountBox2 ul li {
	list-style: none;
}
.discountBox_default{
	position: relative;
	width: 24%;
    margin: 0%;
    padding: 1%;
	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));
}

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

.discountBox_default_c2 {
	position: relative;
	width: 50%;
    margin: 0%;
    padding: 1%;
	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));
}

.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: 48%;   /* 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; */
}

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

.discountBox_default_row2 img{
	margin: 46px 0px 0px;
}


.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: 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%;
}


/* 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%;
}





/* newSale 黑五精品特賣  END */



/* 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__img{
	width: 35%;
	margin: 3%;
}

.gift__info{
	margin-top: 5% ;
}

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

.beautySale__wrapper{
	padding-top: 3%;
}


/*---------  美妝&精品 任2件88折 START   ----------*/
.brandBox__one:hover, .brandBox__two__contentBox:hover{
	/* transform: scale(1.03); */
	opacity: 0.9;
	transition: all 0.2s;
}
.brandBox__btn-wrapper>.btn {
	line-height:1.2rem; /*0.6rem; */
	/* padding: 0 7%; */
	background-color: #ffffffcf;
	margin-bottom: 7%;
	width: 70%;
}
.brandBox__btn-wrapper2>.btn {
	/* line-height:1.2rem; 0.6rem; */
	background-color: #ffee06d1;
	margin-bottom: 7%;
	width: 55%;
	color: black;
}

.brandBox__wrap{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 4% 0 7%;/*0 5%; */
}

.brandBox__area__layout{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 1% 0%;
	z-index: 1;
	/* margin-right: -17%; */
	/* flex-wrap: wrap; */
}
.width-justify{
	width: 100%;
}
.brandBox__one__new{
	position: relative;
	width: 47%;
	/* margin-bottom: 3%; */
}
.brandBox__one{
	position: relative;
	width: 32.5%;
	margin-bottom: 3%;
}
.brandBox__one__contentBox{
	position: absolute;
	text-align: center;
	width: 100%;
	bottom: 0px;
	left: 0;
	height: 50%;
	/* background-color: #0404045e; #ffffffb0; */
	z-index: 10;
	padding: 1% ;
}
.brandBox__one__contentBox__title, .brandBox__two__contentBox__title{
	text-transform: uppercase;
	line-height: 1.5rem;
}



.brandBox__two{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	width: 33.5%;
	/* margin-bottom: 3%; */
	margin: 0 7px 3% 0px; /* 0 -8px 3% -11px; */
}

.brandBox__two__contentBox{
    position: relative;
    width: 47%;
    height: 47%;
    /* background-color: #f34d6d; */
    /* margin-right: 0.5%; */
    margin-left: 4px; /* 2% */
    margin-top: 0%;
}

.brandBox__two__contentBox:nth-child(1), .brandBox__two__contentBox:nth-child(2){
	/* border: 2px #f9f330 solid; */
	box-sizing: border-box;
}

.brandBox__two__contentBox:nth-child(3), .brandBox__two__contentBox:nth-child(4){
	margin-top: 1%;
	margin-bottom: 1%;
	box-sizing: border-box;
}

.brandBox__two__content{
	position: absolute;
	bottom: 0%;
	width: 100%;
	height: 27%;
	/* line-height: 1.5em; */
	background-color: #252323bf;
}

.brandBox__two__content__bgc{
	position: absolute;
	bottom: 0%;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(0deg, #46a1b5 0%, #706c6c00 80%, #0a3ee200 100%);
}
#snackSale .brandBox__two__content__bgc{
	background-image: linear-gradient(0deg, #263434 0%, #706c6c00 80%, #0a3ee200 100%);
}

.brandBox__two__content__nobgc{
	position: absolute;
	bottom: 0%;
	width: 100%;
	height: 27%;
	/* background-color: white; */
}

.brandBox__two__contentBox__btn{
	position: absolute;
	width: 100%;
	/* bottom: 4%; */
	bottom: -3%;

}

.brandBox__wrap__new{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0;
}


.brandBox__verticalTwo{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	width: 52%;
	height: 48%;
}

.brandBox__two__new{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	width: calc(33%/2);
	margin-bottom: 3%;
}
.brandBox__area__layout__mgl-justisfy{
	margin-right: -18%;
}
.brandBox__area__layout__mgl-justisfy2{
	margin-left: -9%;
}
.mgl-justisfy{
	margin-left: -26%;
}
/* .mgl-justisfy2{
	margin-right: 56%;
} */
.mgl-justisfy2{
	margin-right: -26%;
}


.brandBox__area__layout2{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 1% 0%;
	z-index: 1;
	/* margin-right: -17%; */
	/* flex-wrap: wrap; */
}








/* ------------------ 限量美妝 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: 3%; */
	width: 100%;
	margin: -2px auto 0;
	background: url(../images/wave-yellow.jpg) repeat-x top left #009bbb;
}
.brandTitleBox {
	padding-top: 2%;
	margin-bottom: 1.5%;
}

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

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

.makeupBox {
	width: 90%;
	margin: 0 auto;
	padding-bottom: 2%;	
}
.makeupBox2 {
	position: relative;
	width: 80%;
	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);
}

.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;
	filter: drop-shadow(3px 4px 3px #626262);
	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;
}


.btn-50off {
    padding: 2% 3%;
    text-align: center;
    font-size: medium;
    font-weight: 600;
	position: absolute;
	right: 22px;
	bottom: 22px;
}

.btn_brand {
	position: absolute;
	bottom: 8%;
	width: 50%;
	left: 25%;
	color: #fff;
	background-color: #3e3f40eb;
	border-radius: 0px 0px 24px 0px;
}
.btn_brand:hover {
	background-color: #111111;
	color: #fff1c9;
	border-radius: 24px 0px 0px 0px;
	transition: all 0.3s linear;
}

.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: 3% 0% 0%;
	text-align: center;
}

.title-area, .title-areaB {
	text-align: center;
	margin-bottom: 0.5%;
}
.title-area img, .title-areaB img {
	/* max-width: 33%; */
	margin: 0%; /* 2% 0 1% 0;*/
	max-height: 100%;
	width: auto;
	height: auto;
}

.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%;
    /* display: inline-table; 
	filter: drop-shadow(3px 4px 3px #666);*/
    font-weight: 600;
	padding: 0%;
	-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));
}

.brandBox_per_noBG:hover {
	transform: scale(0.98);
}

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

.Box_even {
	margin-top: 4%;
}

.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: 80%;
    margin: 1% auto;
}
.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-Valentinesday-img2 {
	background-image: url(../images/bk-LeftBottom.png), url(../images/bk-RightBottom.png);
	background-repeat: no-repeat, no-repeat;
	background-position: 5% 100%, 102% 114%;
}

.newin__area{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 84%;
    /*  margin: 0% 8%; */
	padding-bottom: 3%;
}

.mainBox-bg {
    filter: saturate(1.0);
}

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

.btn-summer {
    padding: 4%;
    font-size: medium;
}

.btn-newin {
    position: absolute;
	z-index: 3;
	top: 352px;
    right: 54px;
}
.btn-newin1 {
    position: absolute;
	z-index: 3;
	top: 240px;
    right: 44px;
}
.btn-newin2 {
    position: absolute;
	z-index: 3;
	top: 182px;
    right: 44px;
}

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


/* 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; */
}

.highlight-event-btn {
    background: #111;
    width: 36%;
    margin: 2% auto;
    padding: 1.5%;
    color: #ffe248;
	font-weight: 600;
	border: 2px solid #111;
	border-radius: 0px 0px 24px 0px;
}
.highlight-event-btn:hover {
    background: transparent;
    color: #fff;
    transition: all 0.3s linear;
	border: 2px solid #fff;
	border-radius: 24px 0px 0px 0px;
}

.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;
}
/*******************
event-hightlight wrap
*******************/

.highlight-event-box-wrap {
	text-align: center;
}
.highlight-event-box-wrap ul {
	width: 70%;
	margin: 0 auto;
}
.highlight-event-box-wrap ul li {
	width: 31%;
	margin: 2% 1%;
	display: inline-table;
	text-align: center;
	color: black;
}
.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;
}
.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: #f13842;  /*  #ffe33a  */
    width: 100%;
    height: 60px;
    line-height: 60px;
    padding-left: 20px;
}
.modal-content .close {
	position: absolute;
	right: 0;
	top: 0;
	/* background-color: #3614fe; */
	color: #fff;
	width: 60px;
	height: 60px;
	
	line-height: 60px;
	text-align: center;
	cursor: pointer;
	transition: all .3s;
}
.modal-content .close:hover {
	background-color:#f7db6d;
	color: #111;
	/* 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;
}
/* 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 {
	text-align: center;
	margin-bottom: 4%;
	/* color: #edff00; */
}
.modal-body-inner h4 {
    margin-bottom: 5px;
    text-align: center;
    /* color: #edff00; */
}

.modal-body-inner::-webkit-scrollbar-track {
	background-color: #666666;
}
.modal-body-inner::-webkit-scrollbar {
	width: 5px;
	background-color:white;
}
.modal-body-inner::-webkit-scrollbar-thumb {
	background-color: #ffd03e;
}
.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;
}
.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 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:#000000; /* #edf395; */
	font-size: 1vw; /* 15px; */
	font-weight: 600;
}
.modal-body-text-special{
	color:#ffef9a;
}
.modal-body-text-wrap h6 {
	color: #0084c1;
}


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

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

.btn2 {
    /* line-height: 40px; */
    padding: 1%;
    text-align: center;
}

.btn_popup {
    /* position: absolute; */
    /* bottom: 3%; */
    width: 32%;
    left: 18%;
    color: #000;
    background-color: #ffe33a;
    border: 2px #000 solid;
    box-shadow: #000 3px 3px 0px;
	border-radius: 24px;
	margin: 5% 34%;
    /* margin: auto 34%;  */
	font-weight: 600;
	font-size: large;
}

.btn_popup:hover {
    background-color: #ffe33a !important;
	color: #333 !important;
	border: 2px #333 solid;
	box-shadow: transparent 3px 3px 0px;
}

.f-h3-b {
    color: #3614fe;
    font-weight: bold;
	font-size: 1.4vw;
}

.btn_popup a{
    color: #333;
    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: #fff6d9;
    text-align: center;
    border: 2px #000000 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: #111111;
    display: inline-block;
    border-bottom: 1px solid #f13842;
    line-height: 2.2em;
    width: 90%;
}

.menu ul li:hover {
	color: #f13842;
    background-color: #f1e1c3;
	/*#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: #000;
    /* border: 3px #000 solid; */

}
/* 收合導覽黏人精*/

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

.toTop-arrow {
	width: 50px;
	height: 50px;
	border: 0;
	border-radius: 50%;
	opacity: 0.9;
	background: #ffe33b;
    color: #000000;
    cursor: pointer;
    position: fixed;
    right: 10px;
    bottom: 10px;
    padding-top: 5px;
    z-index: 999;
	border: 2px #000000 solid;
	font-weight: bold;
}
.toTop-arrow::before, .toTop-arrow::after {
	width: 8px;
	height: 3px;
	border-radius: 5px;
	top: 10px;
	background: #000000;
	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;
}