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

/*gotop*/
.gotop {
	background: url(../images/btn_gotop.png) 0 0 no-repeat;
	width: 70px;
	height: 70px;
    cursor: pointer;
    z-index: 500;
    position: fixed;
    right: 30px;
    bottom: 50px;
    line-height:0;
	font-size:0;
	overflow:hidden;
	transition: all 0.3s cubic-bezier(0.62, 0.01, 0.24, 1.16);
}
.gotop:hover{ background: url(../images/btn_gotop.png) 0 -70px no-repeat; }

.header{ padding: 30px 4%;}

.logo{ width:173px; height:76px; background:url(../images/logo.png) 50% 0 no-repeat;float: left;}

.navbutton001,.navbutton002,.navbutton003{ 
	float:right; 
	margin-top:30px; 
	margin:0 10px; 
	cursor:pointer; 
	transition: all 0.3s cubic-bezier(0.62, 0.01, 0.24, 1.16);
	filter: drop-shadow(0px 3px 0px rgba(0, 0, 0, 0.2));
    -webkit-filter: drop-shadow(0px 3px 0px rgba(0, 0, 0, 0.2));
    -moz-box-shadow: drop-shadow(0px 3px 0px rgba(0, 0, 0, 0.2));
}
.navbutton001{ background:url(../images/nav_01.png) 50% 0 no-repeat; width:133px; height:37px; }
.navbutton002{ background:url(../images/nav_02.png) 50% 0 no-repeat; width:108px; height:37px; }
.navbutton003{ background:url(../images/nav_03.png) 50% 0 no-repeat; width:108px; height:37px; }
.navbutton001:hover,.navbutton002:hover,.navbutton003:hover{ background-position:50% -37px;}

/*主視覺*/
.container-fluid {
	padding: 0;
	background: url(../images/headerbg.jpg) 50% 0 no-repeat;
	height:661px;
}
/*primary*/
.primary {
	position: relative;
	width:1050px;
}
 .primary .wht-mask {
	width: 100%;
	height: 100%;
	opacity: 1;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";  
/*	position: absolute;*/
	top: 0;
	left: 0;
	z-index: 1;
}
.primary {
	position: relative;
	margin-top: -60px;
}
.primary .wht-mask {
	background-color: #fff;
	-webkit-box-shadow:  0 0 30px 5px rgba(94,121,54,0.5);
	-moz-box-shadow: 0 0 30px 5px rgba(94,121,54,0.5);
	box-shadow: 0 0 30px 5px rgba(94,121,54,0.5);
	border-radius: 30px 30px 0 0;
	padding: 5% 2% 3%;;
}
/*內容*/
.pic01{ width:85%; height:auto; margin:2% auto}
.pic02{ width:85%; height:auto; margin:5% auto 0}
.pic03{ width:85%; height:auto; margin:5% auto 9%}
.pic04{ width:85%; height:auto; margin:5% auto 0}

/*按鈕*/
.button_01,.button_02{ 
    height: 81px;
    width: 406px;
    margin: 5% auto 8%;
    transition: all 0.3s cubic-bezier(0.62, 0.01, 0.24, 1.16);
    cursor: pointer;
    filter: drop-shadow(0px 5px 0px rgba(0, 0, 0, 0.2));
	-webkit-filter: drop-shadow(0px 5px 0px rgba(0, 0, 0, 0.2));
	-moz-box-shadow:drop-shadow(0px 5px 0px rgba(0, 0, 0, 0.2));
	}
	
.button_01{background: url(../images/button_01.png) 50% 0 no-repeat;}
.button_01:hover{ background:url(../images/button_01.png) 50% -81px no-repeat;}

.button_02{background: url(../images/button_02.png) 50% 0 no-repeat;}
.button_02:hover{ background:url(../images/button_02.png) 50% -81px no-repeat;}

.button_over{background: url(../images/button_03.png) 50% 0 no-repeat;height: 81px; width: 406px;margin: 5% auto 8%;}

/*footer*/
footer {
	padding: 20px 0;
	background-color: #525252;
	color: #fff;
	text-align: center;
	font-family: sans-serif, microsoft jhenghei;
    font-weight: 600;
    letter-spacing: 1px;
	position: relative;
}
footer .copylogo, footer .copy {
	display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    text-align: -webkit-left;
}
footer .copylogo{
	top: -50px;
    position: relative;
}

/*lightbox*/
.lightbox01{ width:487px; height:364px; background:url(../images/lightbox_01.png) 50% 0 no-repeat; }
.lightbox02{ width:487px; height:364px; background:url(../images/lightbox_02.png) 50% 0 no-repeat; }
.lightbox03{ width:487px; height:364px; background:url(../images/lightbox_03.png) 50% 0 no-repeat; }
.closebt{ width:63px; height:21px; background:url(../images/close.gif) 50% 0 no-repeat; float:right; cursor:pointer;font-size: 0;}
.closebt:hover{ background:url(../images/close.gif) 50% -21px no-repeat;}
.inputbox{ 
    width: 69.5%;
    margin: 100px 0 0 75px;
    float: left;
}
.form-group {
     margin-bottom: 0px; 
	 margin-left: 80px;
}
.lightbox_button01,.lightbox_button02,.lightbox_button03{ 
	width:150px; 
	height:50px; 
	margin:22px 0; 
	float:left; cursor:pointer;
}

.lightbox_button01,.lightbox_button02,.lightbox_button03{ 
    filter: drop-shadow(0px 5px 0px rgba(0, 0, 0, 0.2));
    -webkit-filter: drop-shadow(0px 5px 0px rgba(0, 0, 0, 0.2));
    -moz-box-shadow: drop-shadow(0px 5px 0px rgba(0, 0, 0, 0.2));
	font-size:0;
	
}
.lightbox_button01{ 
	background:url(../images/lightbox_button01.png) 50% 0 no-repeat; 
	margin: 22px 38px 0 0;
}
.lightbox_button01:hover{
	background-color: #ff4700; 
	color:#FFF;
	background:url(../images/lightbox_button01.png) 50% -50px no-repeat; 
}

.lightbox_button02{	background:url(../images/lightbox_button02.png) 50% 0 no-repeat;}
.lightbox_button02:hover{ background:url(../images/lightbox_button02.png) 50% -50px no-repeat; }

.lightbox_button03{	background:url(../images/lightbox_button03.png) 50% 0 no-repeat; margin: 40px 0 0 90px;}
.lightbox_button03:hover{ background:url(../images/lightbox_button03.png) 50% -50px no-repeat; }

@media screen and (max-width: 1280px) { 
.header{ padding: 30px 2%;}
}