@charset "utf-8";
/* CSS Document */

/*基本*/
body{ margin:0; padding:0; background:#3c518c;}
@media screen and (max-width:767px){
body{  background:#2f83bb;}
}
/*全BOX版面*/
.WRAPPER { position: relative; display:block; margin: 0 auto; padding: 0; width:100%;  min-width:1220px; overflow:hidden; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;  }
.WRAPPER img { width:100%; border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none;}
		@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit;}
	}
	
/*背景*/
.bgtop  { z-index:-2; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%; background: url(bg_TOP.jpg?t=1755574454562) no-repeat center top ;}
.bgtop2 { z-index:-2; position:absolute; top:2000px; left:0; width:100%; min-width:1220px; height:100%; background: url(PC_bg.jpg?t=1755574454562) no-repeat center top ;}
.bg_deco  { z-index:-1; position:fixed; top:0; left:0; width: 100%; min-width:1220px;  height:2000px; background: url(PC_deco.png?t=1755574454562) no-repeat center top ;}
	@media screen and (max-width:767px){
		.bgtop {min-width: inherit;  background: url(m_bgtop.jpg?t=1755574454562) no-repeat center top; background-size:100%; height: 158vw; }
		.bgtop2 { min-width: inherit;position:absolute; top:158vw;   background: url(m_bg.jpg?t=1755574454562) no-repeat center top; background-size:100%;  }
		
	}


/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { display:block;} 
.Area .go_bt {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;}
.Area .go_bt:hover {
  -webkit-transform:scale(0.95);
     -moz-transform:scale(0.95);
      -ms-transform:scale(0.95);
       -o-transform:scale(0.95);
          transform:scale(0.95);}
.Area1220 { margin:0 auto; width:1220px;}
.Area960 { margin:0 auto; width:960px;}
	@media screen and (max-width:767px){
		.Area1220 { width:100%;}
		.Area960 { width:100%;}
		/*區塊_切割*/
		.Area_1bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn a { float:left; margin:0 0 2% 0; padding:0; width:100%; list-style: none;}
		.Area_2bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn a { float:left; margin:0 1% 2%; padding:0; width:48%; list-style: none;}
		.Area_3bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn a { float:left; margin:0 1% 2% ; padding:0; width:31.3%; list-style: none;}
		.Area_1bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn_nopadding a { float:left; margin:0; padding:0; width:100%; list-style: none;}
		.Area_2bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn_nopadding a { float:left; margin:0; padding:0; width:50%; list-style: none;}
		.Area_3bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn_nopadding a { float:left; margin:0; padding:0; width:33.3%; list-style: none;}
	}

/*共用*/
.space { margin-bottom:80px;}
	@media screen and (max-width:767px){
		.space { margin-bottom:10vw;}
	}
.Areabottom {margin-bottom: 30px;}	
	
/*版頭*/
.Area_top { position:relative;height: 570px;}
.Area_top .box{ padding-bottom: 70px;}
.Area_top .card { position:absolute; top:3px; right:-222px; width:80%; height:auto;}
.Area_top .btn_more { z-index: 5;position: absolute; top: 80px; left: 1030px;}
.Area_top .title { position: absolute; top:140px; left:50px;}
.Area_top .subtitle { position: absolute; top:365px; left:80px;width: 80%;}
.Area_top .subtitle img{ width:55% ;float: left;}
.Area_top .PD { position: absolute; top:70px; left:570px;}
	@media screen and (max-width:767px){
		.Area_top { height:55vw;}
		.Area_top .box{ padding-bottom: 0;}
		.Area_top .top_btn { top:0; right:2vw; width:17%;  z-index:6;}
		.Area_top .top_btn a { float:inherit; width:100%; margin:5% 0;}
		.Area_top .card {position:relative;margin-left: -94vw;margin-top: -23vw;margin-bottom: -7vw;/* margin: -40vw -66vw 1vw; */width: 150%;}
		.Area_top .btn_more { z-index:999 !important;position: absolute; top:2vw;  width: 100%;left:-5vw}
		.Area_top .btn_more img{ width:15% ;float:right;}
		.Area_top .title { position: absolute; top:12vw; left:0vw;}
		.Area_top .title img{ width:67% ;float: left;}
		.Area_top .subtitle { position: absolute; top:35vw; left:5vw;float: left;}
		.Area_top .subtitle img{ width:65% ;float: left;}
		.Area_top .PD { position: absolute; top:10vw; left:35vw;}
		.Area_top .PD img{ width:65% ;float: right;}
	}

/*版頭*/
.Area_top .title.title_light { position: absolute; top: 140px; left: 120px; z-index: 30; animation: titlelight 0.8s infinite; opacity: 70%;}
@media screen and (max-width:767px){
	.Area_top .title.title_light { position: absolute; top:16vw; left: 1vw; z-index: 30; animation: titlelight 0.8s infinite; opacity: 70%;width:60% ;overflow: hidden;}
	.Area_top .title.title_light img {width:50% ;}
}

/*pc黏人精*/
.Fixedicon{position: fixed; right:0; top:620px; z-index: 100; cursor: pointer;}
.Fixedicon a{display: block; width: 170px; height: 190px;}
.Fixedicon img{width: 70%;}




/*百大品牌10%回饋*/
.Area_brand .box { overflow: hidden;  }
.Area_brand .layout_page  ul { margin: 0;padding: 0;list-style: none;display: flex;flex-wrap: wrap;box-sizing: border-box;justify-content: center; }
.Area_brand .layout_page .kind { margin: 0 auto 3.5%;width: 100%; }
.Area_brand .layout_page .kind li { width: 20%; filter: grayscale(1); }
.Area_brand .layout_page .kind li.cate-hover { filter: grayscale(0); }
    /*公版調整*/
    .Area_brand .box li  { position: relative; min-width: unset; background-color: transparent; }
    .Area_brand .box .PD .PD_img img { position: absolute; height: auto; mix-blend-mode: multiply; }
    .Area_brand .PD_layout .cardNote { display: none;}
	.Area_brand .silver_card .PD_img:after { content: ""; display: block; width: 100%; height: 0; padding-bottom: 110%; background-image: url(brand_bg_02.png?t=1755574454562); background-repeat: no-repeat; background-size: 100%; background-position: center;}
	.Area_brand .golden_card .PD_img:after { content: ""; display: block; width: 100%; height: 0; padding-bottom: 110%; background-image: url(brand_bg_01.png?t=1755574454562); background-repeat: no-repeat; background-size: 100%; background-position: center;}
    @media screen and (min-width:768px){
    .Area_brand .box { min-height: 520px; margin-bottom:5%; }
	.Area_brand .box .PD .PD_img img { top: 20%; left:10%; width: 80%;  }
    }
	@media screen and (max-width:767px){
	.Area_brand .box .PD .PD_img img { top: 22%; left:15%; width: 70%;  }
	.Area_brand .title { width:100%; margin: 0 auto 0.5vw;}
    .Area_brand .box { min-height: 96vw;  margin: 0 auto;width: 100% !important; }
    .Area_brand .box li { margin: 0 2% 3% 0; }
    .Area_brand .layout_page .kind { width: 96%; margin: 0 auto; }
    .Area_brand .layout_page .kind li { width: 33%; margin: 0.5vw auto 0; }
    }
	


/*百大品牌10%回饋*/
.Area_brand2 {z-index: 9;  }
.Area_brand2 .box { overflow: hidden;  }
.Area_brand2 .layout_page  ul { margin: 0;padding: 0;list-style: none;display: flex;flex-wrap: wrap;box-sizing: border-box;justify-content: center; }
.Area_brand2 .layout_page .kind { margin: 0 auto 3.5%;width: 100%; }
.Area_brand2 .layout_page .kind li { width: 20%; filter: grayscale(1); }
.Area_brand2 .layout_page .kind li.cate-hover { filter: grayscale(0); }
    /*公版調整*/
    .Area_brand2 .box li  { position: relative; min-width: unset; background-color: transparent; }
    .Area_brand2 .box .PD .PD_img img { position: absolute; height: auto; mix-blend-mode: multiply; }
    .Area_brand2 .PD_layout .cardNote { display: none;}
	.Area_brand2 .silver_card .PD_img:after { content: ""; display: block; width: 100%; height: 0; padding-bottom: 110%; background-image: url(brand_bg_02.png?t=1755574454562); background-repeat: no-repeat; background-size: 100%; background-position: center;}
	.Area_brand2 .golden_card .PD_img:after { content: ""; display: block; width: 100%; height: 0; padding-bottom: 110%; background-image: url(brand_bg_01.png?t=1755574454562); background-repeat: no-repeat; background-size: 100%; background-position: center;}
    @media screen and (min-width:768px){
    .Area_brand2 .box { min-height: 490px; padding: 1.5%;background: linear-gradient(90deg, #c29453, #ebb569);  border-radius:20px;}
	.Area_brand2 .box .PD .PD_img img { top: 25%; left:20%; width: 60%;  }
    }
	@media screen and (max-width:767px){
	.Area_brand2 .box .PD .PD_img img { top: 22%; left:15%; width: 70%;  }
	.Area_brand2 .title { width:100%; margin: 0 auto 0.5vw;}
    .Area_brand2 .box { min-height: 60vw; margin: 0 auto; width: 94% !important;padding: 1.5%;background: linear-gradient(90deg, #c29453, #ebb569);  border-radius:20px;}
    .Area_brand2 .box li { margin: 0 2% 3% 0; }
    .Area_brand2 .layout_page .kind { width: 96%; margin: 0 auto; }
    .Area_brand2 .layout_page .kind li { width: 33%; margin: 0.5vw auto 0; }
    }
	




/*注意事項*/
.Area_footer { padding:40px 0 40px; background:#e0e0e0;}
.Area_footer .box .btn { background:#000; border-radius:60px; color:#fff; line-height:24px; display:inline-block; padding:1% 3%; font-size:24px; font-family:"微軟正黑體", "Century Gothic"; margin:50px auto 0;}
.Area_footer .box .btn i { width:0.5rem; height:0.5rem; display:inline-block; border:2px solid #fff; border-top:none; border-left:none; transform:rotate(-45deg);  position:relative; bottom:0.3rem;}
.Area_footer ul { margin:20px 0 0; padding:0; list-style:none; overflow: hidden;}
.Area_footer ul::after { content:""; display:block; clear:both;}
.Area_footer ul li {  color:#929292; font-family: "Century Gothic", "微軟正黑體"; text-align:justify; }
.Area_footer ul li:first-child { float: left; width:15%; font-size: 22px; letter-spacing:3px }
.Area_footer ul li:last-child { float: left; width:85%; font-size: 15px;}
.Area_footer li span { text-decoration:underline;}
.Area_footer ul li a { display:inline-block; color:#999}
	@media screen and (max-width:767px){
		.Area_footer {padding: 4vw 0 33vw;}
		.Area_footer .box .btn {  line-height:9vw; padding:1% 8%; font-size:1m;  font-weight: bold;  margin:50px auto 0;}		
		.Area_footer .box_1 { width: 100%}
		.Area_footer.Area_boxstyle { padding:0 0 30vw;}
		.Area_footer .box a { margin:0 auto;}
		.Area_footer ul { margin:5% auto 0; width:95%;}
        .Area_footer ul li {  color:#999; font-size:4vw; line-height: 1.5; text-align:justify}
        .Area_footer ul li:first-child { float: left; width:100%; font-size: 6vw; letter-spacing:2vw; text-align: center;}
        .Area_footer ul li:last-child { float: left; width:100%;  font-size: 3.2vw; letter-spacing:0;}
        }


/*浮層內表格*/
.agreeArea .box table { margin: 3%!important; }
.agreeArea .box th { padding: 2%!important; }
.agreeArea .box td { padding: 2%!important; text-align: left!important; }



	
/*隱鑶*/
.for_pc {}
.for_phone { display:none !important;}
	@media screen and (max-width:767px){
		.for_pc { display:none !important;}
		.for_phone { display: inherit !important;}
	}



/*精選品牌區*/

.PD_layout[data-pd-pdlogo="3"] .PD .PD_logo img {
    border-radius: 10em;
}
@media screen and (max-width: 767px) {
    .PD_layout[data-pd-pdlogo="3"] .PD .PD_logo {
        height: 15vw;
    }
}

	.PD_layout.PD_layout-D1_02 {
		background-color: #fdefd9
	}
	
	.PD_layout.PD_layout-D1_02 .PD_into {
		padding-top: .8em
	}
	
	.PD_layout.PD_layout-D1_02 .PD h3 {
		background-color: #837b73
	}
	
	.PD_layout.PD_layout-D1_02 .PD h4 b {
		display: none
	}
	
	.PD_layout.PD_layout-D1_02 .PD h3 {
		-webkit-box-ordinal-group: 3;
		-ms-flex-order: 2;
		order: 2
	}
	
	.PD_layout.PD_layout-D1_02 .PD h4 {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 1;
		order: 1
	}
	
	@media screen and (min-width: 768px) {
		.PD_layout.PD_layout-D1_02 {
			padding:1.2em 1.2em;
			border-radius: 1.2em
		}
	
		.PD_layout.PD_layout-D1_02 .PD h3 {
			margin: 0 1em;
			font-size: 1.2em
		}
	
		.PD_layout.PD_layout-D1_02 .PD h4 {
			line-height: .95;
			font-size: 1.5em;
			margin-bottom: .25em
		}
	
		.PD_layout.PD_layout-D1_02 .PD_img {
			padding-top: .3em
		}
	
		.Area960 .PD_layout.PD_layout-D1_02[data-pd-col-pc="2"] {
			padding: 1.5em 1.5em 1.8em
		}
	
		.Area1220 .PD_layout.PD_layout-D1_02 {
			padding: 1.7em 1.7em;
			border-radius: 1.5em
		}
	
		.Area1220 .PD_layout.PD_layout-D1_02 .PD h4 {
			line-height: 1.1
		}
	}
	
	@media screen and (max-width: 767px) {
		.PD_layout.PD_layout-D1_02[data-pd-col-phone="2"] {
			padding:.65em .75em .75em
		}
	
		.PD_layout.PD_layout-D1_02[data-pd-col-phone="2"] ul {
			padding: .2em
		}
	
		.PD_layout.PD_layout-D1_02[data-pd-col-phone="2"] .PD_img {
			padding-top: .2em
		}
	
		.PD_layout.PD_layout-D1_02 {
			padding: .65em .5em .75em;
			border-radius: .75em
		}
	
		.PD_layout.PD_layout-D1_02 ul {
			width: 100%
		}
	
		.PD_layout.PD_layout-D1_02 .PD h3 {
			margin: 0 .25em;
			letter-spacing: -0.05em;
			max-height: 1.85em;
			line-height: 1.85em;
			font-size: .875em
		}
	
		.PD_layout.PD_layout-D1_02 .PD h4 {
			line-height: 1.1;
			font-size: .85em;
			font-weight: 600;
			margin-bottom: .1875em
		}
	
		.PD_layout.PD_layout-D1_02 .PD h4 span {
			line-height: 1.1
		}
	
		.PD_layout.PD_layout-D1_02 .PD_img {
			padding-top: .35em
		}
	}