@charset "big5";
/*切換頁按鈕*/

.gift_video{ 
	width:1200px;
	height:200px;
	background:url(../images/gift.gif) 0 0 no-repeat;
	position:absolute;
	top:440px;
	left:10px;
	display:block;
}

 .video_btn{ width:162px; height:158px; background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/51.png) 0 0 no-repeat; position:absolute; top:70px; left:780px; display:block;
animation-name: rotate1;
	-webkit-animation-name: rotate1;
	animation-duration: 1.5s;
	-webkit-animation-duration: 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
@keyframes rotate1 {
	0% {transform: rotate(-5deg) scale(1);}
	25% {transform: rotate(-5deg) scale(1.4);}
	30% {transform: rotate(-5deg) scale(0.9);}	
	50% {transform: rotate(10deg) scale(1);filter:brightness(115%);}
	100% {transform: rotate(-5deg)scale(1);} }

@-webkit-keyframes rotate1 {
	0% {transform: rotate(-5deg) scale(1);}
	25% {transform: rotate(-5deg) scale(1.4);}
	30% {transform: rotate(-5deg) scale(0.9);}	
	50% {transform: rotate(10deg) scale(1);filter:brightness(115%);}
	100% {transform: rotate(-5deg)scale(1);} }

.video_btn:hover{background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/51.png) 0 0 no-repeat; transform: translateY(0.2em);}

.video_btn2{ width:154px; height:156px; background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/52.png) 0 0 no-repeat; position:absolute; top:90px; left:920px; display:block;
animation-name: rotate1;
	-webkit-animation-name: rotate1;
	animation-duration: 1.5s;
	-webkit-animation-duration: 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
.video_btn2:hover{background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/52.png) 0 0 no-repeat; transform: translateY(0.2em);}

@keyframes floating {
	0% {transform: translateY(0%);}
	50% {transform: translateY(8%);}	
	100% {transform: translateY(0%);} }

@-webkit-keyframes floating {
	0% {-webkit-transform: translateY(0%);}
	50% {-webkit-transform: translateY(8%);	}	
	100% {-webkit-transform: translateY(0%);} }

a .video_main{ width:762px; height:615px; background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web.png) 0 0 no-repeat; position:absolute; top:-5px; left:10px; display:block;
    animation-name: floating;
	-webkit-animation-name: floating1;
	animation-duration: 1.5s;
	-webkit-animation-duration: 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}


/*PC左側黏人精+goTop+回版頭*/
.fixarea_l { z-index:99; position:fixed; left:0px; top:80px; width:165px; text-align: center; font-family:"微軟正黑體", "Microsoft JhengHei", Arial;
			-webkit-transform: rotate3d(0,0,0,0deg) translate3d(150px,0,0); transform: rotate3d(0,0,0,0deg) translate3d(150px,0,0); -webkit-transform-origin:top right; transform-origin:top right;
			  -webkit-transition: all 0.2s ease;
				 -moz-transition: all 0.2s ease;
				  -ms-transition: all 0.2s ease;
				   -o-transition: all 0.2s ease;
					  transition: all 0.2s ease;}
.fixarea_l_off { -webkit-transform: rotate3d(0,0,0,0deg) translate3d(0,0,0); transform: rotate3d(0,0,0,0deg) translate3d(0,0,0);}
.fixarea_l .title { position:relative;background-color: #444;width: 70%;color: #FFF;margin: 0 auto;}
.fixarea_l .title img {}
.fixarea_l .footer {width: 108px;height:20px;background: #FFF;border-radius: 0 0 20px 20px;margin: 0 auto;}
.fixarea_l .fixbox_head{position: relative;}
.fixarea_l .fixbox_head::after{content: "好康快訊";position: absolute;bottom:6px;left:50px;font-weight:900;color:#fff;}
.fixarea_l .fixbox_body{position: relative;}
.fixarea_l .fixbox_body::after{content: "精選會場";position: absolute;bottom:6px;left:50px;font-weight:900;color:#fff;}
.fixarea_l .title .icon{position:relative;top:-35px;margin-bottom: -40px;}
.fixarea_l .fix_box { margin:0 auto; }
.fixarea_l ul.fix { margin:0px auto 0;width: 108px; padding:5px 0 5px; list-style:none;overflow: hidden;background: #FFF;border-radius: 0;}
.fixarea_l ul.fix li { position:relative; width: 75%; height:auto;margin:0 0 0 10%; padding:2px 0 0; font-size:15px; line-height:25px;/*border-bottom: 1px solid #ff457e;*/}
.fixarea_l ul.fix li::after {content: "";width: 90px;height: 1px;background: #89b0ff;position: absolute;left: 0px;bottom:-1px; }
.fixarea_l a { display:block; text-decoration:none; color:#222;}
.fixarea_l a:hover{ color:#D30048}
.fixarea_l ul.fix li:nth-child(4) a{line-height: auto; }
.fixarea_l ul.fix li:last-child::after{display: none;}
.fixarea_l .fix_main { }
.fixarea_l .fix_main li { padding:12px 0 8px;  height:40px;}
/*.fixarea_l .fix_main li::before { content: ""; display: block; position: absolute; bottom:0; left:18%; width:64%; height:1px; background-color:#5b0000; background-color:rgba(255,255,255,0.2);}*/
.fixarea_l .fix_other { }
.fixarea_l .fix_other li { padding:5px 0; }
/*.fixarea_l .fix_other li:before { content: ""; display: block; position: absolute; bottom:0; left:18%; width:64%; height:1px; background-color:#5b0000; background-color:rgba(255,255,255,0.2);}
.fixarea_l .fix_other li:last-child::before { display:none;}*/
.fixarea_l  .btn_on a { color:#F8DAA5; }
.fixarea_l .go_bt {
  -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
      -ms-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
          transition: all 0.2s ease;}
.fixarea_l .go_bt:hover { filter: brightness(105%);}

.fixarea_l ul.fix2 { margin:0px auto 0;width: 108px; padding:5px 0 30px; list-style:none;overflow: hidden;background: #363636;border-radius: 0 0 50px 50px;overflow: hidden;}
.fixarea_l ul.fix2::after {content: "";clear:both}
.fixarea_l ul.fix2 li { position:relative;float: left; width: 30%; height:34px;margin:0 0 0 13%; padding:0; font-size:15px; line-height:34px;/*border-bottom: 1px solid #ff457e;*/}
.fixarea_l ul.fix2 li:nth-child(odd)::after {content: "";width: 1px;height: 34px;background: rgba(255,255,255,0.2);position: absolute;left: 38px;bottom:-2px; box-shadow: 1px 0px 0 rgba(0,0,0,0.2);}
.fixarea_l ul.fix2 li:nth-child(even)::after {content: "";width: 90px;height: 1px;background: rgba(255,255,255,0.3);position: absolute;left: -51px;bottom:-1px;box-shadow: 1px 1px 0 rgba(0,0,0,0.2); }
.fixarea_l ul.fix2 li:last-child::after {display: none; }
.fixarea_l ul.fix2 a { display:block; text-decoration:none; color:#FFF;}
.fixarea_l ul.fix2 a:hover{ color:#FFFF00;}
.fixarea_l ul.fix2 li:last-child::after{display: none;}



/*浮動效果*/
@keyframes floating1 {
	0% {transform: translateY(0%);}
	50% {transform: translateY(10%);}	
	120% {transform: translateY(0%);} }

@-webkit-keyframes floating1 {
	0% {-webkit-transform: translateY(0%);}
	50% {-webkit-transform: translateY(10%);	}	
	120% {-webkit-transform: translateY(0%);} }

.floating1{
	width:822px; height:364px; background:url(hhttps://sunfar.blob.core.windows.net/webimage/sf/dc/isunfar/action/buy202010/images/new-web2.png) 0 0 no-repeat; position:relative; top:-230px; left:30px; display:block;
	animation-name: play1;
	-webkit-animation-name: play1;
	animation-duration: 2s;
	-webkit-animation-duration: 2s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}	
	
.floating2{
	width:159px; height:200px; background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202103-winterBTS/images/new-web3.png) 0 0 no-repeat; position:relative; top:-280px; left:990px; display:block;
	animation-name: floating1;
	-webkit-animation-name: floating1;
	animation-duration: 2s;
	-webkit-animation-duration: 2s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}		
/*	
.main{ width:762px; height:615px; background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202103-winterBTS/images/new-web1.png) 0 0 no-repeat; position:absolute; top:0px; left:500px; display:block;
	animation-name: f1;
	-webkit-animation-name: f1;
	animation-duration: 1s;
	-webkit-animation-duration: 1s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}	*/
.mainn{
	width:980px; height:400px; background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202103-winterBTS/images/new-web1.png) 0 0 no-repeat; position:relative; top:90px; left:120px; display:block;
	animation-name: play1;
	-webkit-animation-name: play1;
	animation-duration: 12s;
	-webkit-animation-duration: 2s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
.mainn1{
	width:1001px; height:346px; background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/top.png) 0 0 no-repeat; position:relative; top:0px; left:-20px; display:block;

}

/*閃爍效果*/
@keyframes play1 {
	  0% { 
		filter:brightness(100%);
		
		
	  }
	  20% { 
		filter:brightness(95%);
		
	  }
	  30% { 
		filter:brightness(130%);
		
	  }
	  50% { 
		filter:brightness(95%);
		
	  }
	  100% { 
		filter:brightness(100%);
		
	  }
}
@keyframes f1 {
	0% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web.png")}
    25% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web2.png")}
	50% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web.png")
	75% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web2.png")}
	100% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web.png")}
}

@-webkit-keyframes f1 {
	0% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web.png")}
    25% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web2.png")}
	50% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web.png")
	75% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web2.png")}
	100% {background-image:url("http://images.sunfar.com.tw/sf/dc/isunfar/action/202101new-year/images/new-web.png")}
}

/*我在後面飄*/



.floating{
	width:1200px;
	height:320px; background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202103-winterBTS/images/new-web3.png)no-repeat; position:absolute; top:-10px; left:15px; display:block;
	animation-name: floating;
	-webkit-animation-name: floating;

	animation-duration: 3s;	
	-webkit-animation-duration: 3s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

.floating{
	width:1200px;
	height:320px; background:url(http://images.sunfar.com.tw/sf/dc/isunfar/action/202103-winterBTS/images/new-web3.png)no-repeat; position:absolute; top:-10x; left:15px; display:block;
	animation-name: floating;
	-webkit-animation-name: floating;

	animation-duration: 2.5s;	
	-webkit-animation-duration: 2.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}


@keyframes floating {
	0% {
		transform: translateY(0%);	
	}
	50% {
		transform: translateY(5%);	
	}	
	100% {
		transform: translateY(0%);
	}			
}

@-webkit-keyframes floating {
	0% {
		-webkit-transform: translateY(0%);	
	}
	50% {
		-webkit-transform: translateY(5%);	
	}	
	100% {
		-webkit-transform: translateY(0%);
	}			
}

/*我不在後面飄*/