﻿@charset "utf-8";
/* CSS Document */
body#campaign{background-image: url(../images/kv-bg-3.jpg);background-repeat: repeat-y; padding-bottom: 10em;}

/*主視覺*/
.key-visual{background: url('../images/kv-bg-1.jpg') no-repeat center top; height: 564px;}
.key-visual .wrapper {width: 950px; margin: 0 auto; position: relative;}

/*送*/
.cards{background: url('../images/kv-bg-2.jpg') no-repeat center; height: 271px;}
.cards .wrapper{width: 950px; margin: 0 auto;}
.cards .wrapper div {width: 49%; text-align: center;display: inline-block;}


/*product*/
#T2{background: #fde734;}
#T3{background: #ffd9c9;}
#T4{background: #cba0ff;}
#T5{background: #ffb2dc;}
#T6{background: #ffa087;}
#T7{background: #76e0ff;}
#T8{background: #3ddeab;}
#T9{background: #ffabb6;}
#T10{background: #8d0000;}

/*浮動選單*/

.addmenu01 {
	position:fixed;
	width:247px;
	height:650px;
	right:0px;
	margin-left:490px;/*控制在版面上的位置*/
	top:150px;
	z-index: 999;
*position: absolute !important;
*top: expression(((document.documentElement.scrollTop || document.body.scrollTop) + (!this.offsetHeight && 0)) + "px");
*left:52%;
*margin-left:480px;
*z-index: 999;
}
.TOP_SKY{display: none;}

/*浮動選單ㄌ按鈕hover*/
.addmenu01 .b01 a{display:block;width:157px;height:67px;background-image: url(../images/addmenu_02.png)}
.addmenu01 .b01 a:hover{background-image: url(../images/addmenu_02_2.png)}
.addmenu01 .b02 a{display:block;width:157px;height:66px;background-image: url(../images/addmenu_03.png)}
.addmenu01 .b02 a:hover{background-image: url(../images/addmenu_03_2.png)}
.addmenu01 .b03 a{display:block;width:157px;height:67px;background-image: url(../images/addmenu_04.png)}
.addmenu01 .b03 a:hover{background-image: url(../images/addmenu_04_2.png)}
.addmenu01 .b04 a{display:block;width:157px;height:66px;background-image: url(../images/addmenu_05.png)}
.addmenu01 .b04 a:hover{background-image: url(../images/addmenu_05_2.png)}
.addmenu01 .b05 a{display:block;width:157px;height:57px;background-image: url(../images/addmenu_06.png)}
.addmenu01 .b05 a:hover{background-image: url(../images/addmenu_06_2.png)}




@media screen and (max-width:1024px) {
	.addmenu01 {
	display: none;
}
}

@media screen and (max-width:768px) {
/*主視覺*/
	.key-visual{height: auto;}
	.key-visual .wrapper {width: 100%;}
	.key-visual .wrapper img{width: 100%; height: auto;}

/*送*/
	.cards{background-image: url(../images/kv-bg-3.jpg);background-repeat: repeat-y; height: auto;}
	.cards .wrapper{width: 100%; margin: 0 auto; padding-bottom: .5em;}
	.cards .wrapper div{width: 100%; display: block;}
	.cards .wrapper div a{width: 100%;}
	.cards .wrapper div a img{width: 100%; height: auto;}
	
/*浮動選單*/	
.TOP_SKY{display: block; width:100%; height:85px; position: fixed;bottom: 0; left:0;background-color: rgba(0,71,157,0.7); z-index:88;padding-top: 8px;}
.TOP_SKY ul{ width:100%; height:82px; margin:0 auto;}
.TOP_SKY ul li a{width:33%;height:35px;text-align:center; color:#FFF; font: bold 0.8em/1.1em "微軟正黑體";float:left; border-right:1px solid #FFF;white-space:nowrap;margin-bottom: 3%;display:-webkit-flex;display:flex;-webkit-align-items: center;align-items: center;-webkit-justify-content: center;justify-content: center;overflow: hidden;}
.TOP_SKY ul li:last-child a, .TOP_SKY ul li:nth-child(3) a{border-right:none;}
.TOP_SKY ul li a.active{background-color: #422095;}

}