@charset "UTF-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosanstc.css);
/*------------HAPPY GO 固定CSS Start------------*/
body{ margin: 0; padding: 0;font-family:Arial,\5FAE\8EDF\6B63\9ED1\9AD4,'Noto Sans TC','Microsoft JhengHei','微軟正黑體';background-color:#feda3e!important;}
* {margin: 0; padding: 0;}
a, a:link, a:visited{text-decoration: none;display: inline-block; cursor: pointer;}
a:hover, a:active{text-decoration:none;}
ul{list-style: none;display: inline-block;margin: 0; padding: 0;}
li{display: inline-block;}
.clr {clear: both;}
.fl {float: left;}
.fr {float: right;}
.tc{text-align: center;margin: 0 auto;}
img.image-rwd{ width:100%}
p, li{ font-size:18px; line-height:28px;}
h1{font-family:"Microsoft JhengHei"!important;font-weight:bolder!important;color:#fff!important;}
.remark{font-size:14px; color:#D80000}
@media (max-width: 1024px) {
  p, li{ font-size:15px;}
} 
.container{width: 1000px; padding: 0;}
@media (max-width: 1000px) {
.container{width: 100%;}
}
/*header*/
header {text-align: center;padding: 5px 0;/*背景色*/background-color:#241e7a;height:40px;position:fixed;top:0;width:100%;z-index:999999;}
header .fr a:link, header .fr a:visited{display:inline-block;margin-left:10px;}
header .topnav {width:98%;margin:0 auto;line-height:30px;font-size:15px;}
header .topnav a:link, header .topnav a:visited{text-decoration: none; color:#fff; font-size: 15px; }
header .topnav a:hover, header .topnav a:active{color:#0059bd; text-decoration: none;}
header .topnav .fl{margin-right: 8px;}
header .topnav .fl img,
header .topnav .fr img{vertical-align:middle;margin-right:3px;margin-left: 10px;margin-top: -2px;}
header .topnav .fl.pt {padding-top:4px;}
header .topnav > div.fl:first-child > a > img{margin-left: 0;}
header .topnav div.gg{margin-top: 5px;margin-left: 20px;}
header .topnav div.fb{margin-top: -5px;}
@media screen and (min-width: 650px) and (max-width: 934px) {
  header {width: 100%;}
  header .topnav {width: 98%; margin:0 auto;line-height:20px;font-size:13px;}
  header .topnav div.fb{margin-top: 5px;}
  }
@media screen and (min-width: 320px) and (max-width: 649px) {
  header .topnav {width: 93% ; margin:0 20px 0 auto;line-height:18px;font-size:12px;}
  header .topnav .fl:first-child a img{width: 70%;margin-top: 8px;}
  header .topnav div:first-child + div{display: none;}
  header .topnav .fl{margin-right: 0;}
  header .topnav .fl img, header .topnav .fr img{vertical-align:middle;margin-left: 3px;}
  header .topnav div.fb{margin-top: 5px;}
}

/*NAV*/
nav.pc{margin:-155px auto 0; text-align: center;z-index: 999; position:relative;top:0;padding:0px; background:url(../images/r-alpha.png)}
nav.pc ul{padding:0; margin:0;}
nav.pc ul li{text-align: center;padding:0; margin:0 20px 0 0;font-size: 15px;font-weight: bold;color:#fff!important;}
nav.pc ul li p{ display:block;padding:0; margin:0; position:relative; top:5px; line-height:15px;}
nav.pc ul li a{height:59px;color:#fff;font-size: 15px;font-weight: bold;padding:0; margin:0;/*text-shadow: 1px 1px 5px #fff, -1px -1px 5px #fff;*/transition: all 0.2s ease;}
@media (max-width: 1024px) {
	nav.pc{margin:-155px auto 0;top:20px;}
}

/* NAV for MOBILE*/
@media (max-width: 768px) {
  #menu{ margin-top:40px;}
  #menu .navbar-default {border-color:transparent; border: none;}
  #menu .navbar-default .navbar-header{background-color: #cc0000;}
  #menu .navbar-default .navbar-nav > li{ margin:0; padding:0; text-align:center; font-size:20px;}
  #menu .navbar-default .navbar-nav > li p{ margin:0; padding:0; font-size:14px; display:inline-block; margin-left:8px;}
  #menu .navbar-default .navbar-nav > li > a {color:#333;width:100vw;background-color:#feda3e;border-bottom:1px solid #ccc;}
  #menu .navbar-default .navbar-nav > li > a:hover,
  #menu .navbar-default .navbar-nav > li > a:focus {color: #cc0000;background-color:#feda3e;}
  #menu .navbar-default .navbar-nav > .active > a,
  #menu .navbar-default .navbar-nav > .active > a:hover,
  #menu .navbar-default .navbar-nav > .active > a:focus {color: #cc0000;background-color:#feda3e;}
  #menu .navbar-default .navbar-toggle {border-color:#fff;}
  #menu .navbar-default .navbar-toggle:hover,
  #menu .navbar-default .navbar-toggle:focus {background-color: #cc0000;}
  #menu .navbar-default .navbar-toggle .icon-bar {background-color: #feda3e;}
  #menu .navbar-default .navbar-collapse,
  #menu .navbar-default .navbar-form {border-color:#fff;}
}

section{ padding:45px 0 65px;}

/*KV*/
#kv{ width: 100%;margin-top:40px;padding:0px;}
#kv .sign{background:url(../images/kv-md.jpg) no-repeat center center; background-size:cover; min-height:90vh; position:relative;}
@media (min-width: 1680px) {
  #kv .sign{ background:url(../images/kv-lg.jpg) no-repeat center center; background-size:cover;min-height:90vh;}
}
@media (max-width: 1366px) {
  #kv .sign{ background:url(../images/kv-lg.jpg) no-repeat center -120px; background-size:100%;min-height:90vh;}
}
@media (max-width: 1280px) {
  #kv .sign{ background:url(../images/kv-md.jpg) no-repeat center -150px; background-size:cover;min-height:90vh;}
}
@media (max-width: 1023px) {
  #kv .sign{ width: 100%; margin-top: -20px;background:url(../images/kv-xs.jpg) no-repeat center bottom; background-size:cover;min-height:85vh;}
}
@media (max-width: 767px) {
  section{ padding:10px 0 25px;}
  h1 img{ width:50%}
  #kv{padding-top: 0; padding: 0; margin: 0; }
  #kv .sign{ width: 100%; margin-top: -20px;background:url(../images/kv-xs.jpg) no-repeat center bottom; background-size:cover;min-height:65vh;}
}

/*main*/
#main-a{background:url(../images/bg-main-01.jpg) no-repeat center center; background-size:cover;}
#main-a .pic-a{position:relative; top:0px; z-index:10;}
#main-a .pic-b{position:relative; margin:70px auto -120px; z-index:10}
#main-b{background:url(../images/bg-main-03.jpg) no-repeat center center; background-size:cover; height:500px; margin-top:-2px}
#main-b .pic-c{background:url(../images/bg-main-text.png) no-repeat 37% 100px; height:500px;background-size:45%;}
#main-b .pic-c .text { padding-top:150px}
#main-b .pic-c .text h2, #main-b .pic-c .text h3{color:#ec6144}
#main-b .pic-c .text h2 span{ color:#241e7a}
#main-b .pic-c .text h2{margin:20px 0 20px; padding:0; line-height:36px; font-size:28px}
#main-b .pic-c .text h3{margin:10px 0 0; padding:0;font-size:22px}
@media (max-width: 1024px) {
#main-b .pic-c{background:url(../images/bg-main-text.png) no-repeat 8% 80px; height:500px;background-size:auto;}
}
@media (max-width: 767px) {
#main-a .pic-a{position:relative; top:0px; z-index:10; padding:0px; margin-top:-65px}
#main-a .pic-b{position:relative; margin:30px auto -55px; padding:0px}
#main-b .pic-c{background:url(../images/bg-main-text.png) no-repeat 0px 50px; height:500px;background-size:90%;}
#main-b{height:300px;}
#main-b .pic-c .text { padding-top:100px; padding-left:65px}
#main-b .pic-c .text h2{margin:10px 0 10px; padding:0; line-height:24px; font-size:18px}
#main-b .pic-c .text h3{margin:5px 0 0; padding:0;font-size:16px}
}
@media (max-width: 480px) {
#main-b .pic-c .text { padding-top:80px; padding-left:65px}
}
/* offer */
#offer{ background:url(../images/bg-offer.jpg) no-repeat center center; background-size:cover;}
#offer h1{ margin-bottom:35px}
#offer .container-fluid{background:url(../images/bg-offer-sec.jpg) no-repeat center 156px; background-size:55%;}
#offer .content-box{ background:#fff; padding:0px; margin:0 auto 200px; width:900px; min-height:500px;float:none; clear:both;box-shadow: 0px 4px 12px 6px rgba(0%,0%,0%,0.2)}
#offer .content-box ul.nav{ display:block; width:100%}
#offer .nav-tabs {
  border-bottom: 1px solid #660000;
  background-color:#cc0000;
}
#offer .nav-tabs > li {
  float: left;
  margin-bottom: -1px;
  width:16.666%;
  text-align:center;
}
#offer .nav-tabs > li > a {
  margin-right: 2px;
  line-height: 1.42857143;
  border: 1px solid transparent;
  border-radius:0 0;
  color:#fff;
}
#offer .nav-tabs > li > a:hover {
  border-color: #660000;
  background-color:#990000;
}
#offer .nav-tabs > li.active > a,
#offer .nav-tabs > li.active > a:hover,
#offer .nav-tabs > li.active > a:focus {
  color: #fff;
  cursor: default;
  background-color: #990000;
  border: 1px solid #660000;
  border-bottom-color: transparent;
}
@media screen and (min-width: 1920px) {
	#offer .container-fluid{background:url(../images/bg-offer-sec.jpg) no-repeat center 156px; background-size:65%;}
}
@media screen and (max-width: 1919px) {
	#offer .container-fluid{background:url(../images/bg-offer-sec.jpg) no-repeat center 156px; background-size:75%;}
}
@media screen and (max-width: 1480px) {
	#offer .container-fluid{background:url(../images/bg-offer-sec.jpg) no-repeat center 156px; background-size:80%;}
}
@media screen and (max-width: 1280px) {
	#offer .container-fluid{background:url(../images/bg-offer-sec.jpg) no-repeat center 156px; background-size:90%;}
}
@media screen and (max-width: 1024px) {
#offer .container-fluid{background:url(../images/bg-offer-sec.jpg) no-repeat center 230px; background-size:cover;}
#offer .content-box{width:100%;}
}
@media screen and (max-width: 768px) {
#offer .container-fluid{background:url(../images/bg-offer-sec.jpg) no-repeat center 230px; background-size:cover;}
#offer .content-box{width:95%;margin:0 auto 140px}
}
@media screen and (max-width: 767px) {
#offer .container-fluid{background:url(../images/bg-offer-sec.jpg) no-repeat center 169px; background-size:cover;}
#offer .content-box{width:95%;margin:0 auto 30px}
#offer .nav-tabs > li {
  width:33.33333%; font-size:18px}
  #offer h1{ margin-bottom:15px}
}
@media screen and (max-width: 375px) {
#offer .container-fluid{background:none;}
#offer .content-box{width:100%;margin:0 auto 0px}
}
#resp-tab6, #resp-tab5, #resp-tab4, #resp-tab3, #resp-tab2, #resp-tab1{ padding-top:15px; padding-bottom:15px;}
.feed-box{ margin:0; padding:0;}

.feed-box .pic{ margin:0; padding:0px;} 
.feed-box .text{ margin:0; padding:15px 25px; display:block;}
.feed-box .text ul{ margin:0; padding:0}
.feed-box .text h4{ margin:0 0 5px; padding:0;color:#482c00; font-size:18px; line-height:22px}
.feed-box .text p{margin:0 0 2px 0; padding:0;color:#666; font-size:15px;line-height:20px; letter-spacing:1px; clear:both;}
.feed-box .right {
	position: relative;
	right: 0px;
	float: right;
}
.feed-box .left {
	position: relative;
	left: 0px;
	float: left;
} 
.but-feedback a{
-webkit-border-radius: 55px;
-moz-border-radius: 55px;
border-radius: 55px;
border:2px solid #eb6043; display:inline-block;
padding:2px 15px;
color:#eb6043;
margin-top:5px;
	}
.but-feedback a:hover{ text-decoration:none; color:#eb6043;}

/*freepoint*/
#freepoint{ background:url(../images/bg-freepoint.jpg) no-repeat center center; background-size:cover;}
.content-logo{ display:inline-block}
.content-logo ul{margin:0 auto; display:table; text-align:center}
.content-logo li{padding:15px;margin: 0px; float:none;}
.content-logo li img{border:1px solid #e9e9ea;}
#freepoint h1{font-weight:bolder; line-height:18px; margin-top:65px}
#freepoint h1 small{ color:#3b7e00; font-size:20px; display:block;margin:25px 0 25px;font-weight:bolder;letter-spacing:2px;line-height:32px;}
#freepoint h1 span{ color:#cc0000;font-size:24px;letter-spacing:0px}
.but-freepoint a{ display:inline-block; padding:10px 35px; text-align:center; background-color:#ffcc00; font-size:18px; font-weight:bolder; color:#333;}
.but-freepoint a span{ color:#cc0000}
.but-freepoint a:hover{text-decoration:none;color:#333;}
.but-freepoint .glyphicon{ margin-top:-6px}
@media (min-width: 1200px) {
#freepoint .content-logo .col-lg-2{/*width:20%;*/float:none;width: 16.66666667%;}
}
@media (max-width: 1023px) {
.feed-box .text{ margin:0; padding:5px 10px 0; display:block;}

}
@media (max-width: 767px) {
#freepoint{ background:url(../images/bg-freepoint.jpg) no-repeat center top; background-size:cover;}
.feed-box .text{padding:20px 35px;}
.but-feedback a{
  display: block;
  margin-right: auto;
  margin-left: auto;
  text-align:center;
  width:60%;
}
}

/* feedback */
#feedback{ background:url(../images/bg-feedback.jpg) no-repeat center center; background-size:cover;}
#feedback h1{margin-bottom:25px; line-height:55px}
#feedback h1 small{letter-spacing:2px; color:#fff; font-size:30px;}
#feedback .container-fluid{background:url(../images/bg-feedback-sec.jpg) no-repeat center 230px; background-size:60%; padding-bottom:70px}
#feedback .content-box{ background:#fff; padding:0px 0 3px 0; margin:0 auto 100px; width:900px; float:none; clear:both;box-shadow: 0px 4px 12px 6px rgba(0%,0%,0%,0.3);}
#feedback .feed-box{ position:relative; top:3px}
.box-first{ padding:35px 25px;}
.box-first:nth-child(1){padding:35px 25px 0;}
.box-first:nth-child(1) h4{padding-top:0px}
.box-first h4{ color:#482c00; padding-top:20px}
#feedback .box-first p {margin:0; padding:0;color:#666; font-size:15px;line-height:24px; letter-spacing:1px;}
#feedback ul{padding:0 0 0 15px;}
#feedback li {margin:0; padding:0;color:#666; font-size:15px;line-height:24px; letter-spacing:1px;display:list-item; list-style-type:square}
#feedback h4 span.pic{ margin-bottom:5px;}
#feedback h4 span.text{ line-height:18px; padding:0; margin-bottom:5px}
#feedback h4 span.text.pp{padding:15px 0 0 8px;}
#feedback h4 span.text.ppp{padding:10px 0 0 0px;}
@media screen and (min-width: 1920px) {
	#feedback .container-fluid{background:url(../images/bg-feedback-sec.jpg) no-repeat center 230px; background-size:65%;}
}
@media screen and (max-width: 1919px) {
	#feedback .container-fluid{background:url(../images/bg-feedback-sec.jpg) no-repeat center 230px; background-size:75%;}
}
@media screen and (max-width: 1480px) {
	#feedback .container-fluid{background:url(../images/bg-feedback-sec.jpg) no-repeat center 230px; background-size:80%;}
}
@media screen and (max-width: 1280px) {
	#feedback .container-fluid{background:url(../images/bg-feedback-sec.jpg) no-repeat center 230px; background-size:90%;}
}
@media screen and (max-width: 1023px) {
#feedback .container-fluid{background:url(../images/bg-feedback-sec.jpg) no-repeat center 230px; background-size:cover;}
#feedback .content-box{width:95%;margin:0 auto 140px}
}
@media screen and (max-width: 767px) {
#feedback .container-fluid{background:url(../images/bg-feedback-sec.jpg) no-repeat center 230px; background-size:cover;}
#feedback .content-box{width:95%;margin:0 auto 25px}
#feedback h1{margin-bottom:15px; line-height:35px}
#feedback h1 small{font-size:22px;}
#feedback h4 span.text.pppp span{font-size:17px; letter-spacing:-1px}
}
@media screen and (max-width: 480px) {
#feedback .container-fluid{background:none;}
#feedback .content-box{width:100%;margin:0 auto 0px}
#feedback h4 span.text{padding:10px 0 0 0px;}
#feedback h4 span.text.ppp{padding:20px 0 0 0px;}
#feedback h4 span.text.ppp br{ display:none}
#feedback h4 span.text.pppp{padding:20px 0 0 0px;}
#feedback h4 span.text.pppp span{font-size:18px; letter-spacing:0px}
#feedback h4 span.text.pppp br{ display:none}
}
/* rule */
#rule{ background:url(../images/bg-rule-lg.jpg) no-repeat center center; background-size:cover;}
#rule h1{color:#39220c;text-align:center; font:55px; margin-bottom:15px;}
#rule h4{color:#39220c;text-align:center; font:34px; margin:35px auto 15px;}
#rule p, #rule li, article{color:#39220c!important;font-weight:bolder;font-size:15px; line-height:25px;}
#rule article li{ display:list-item; list-style-type:square; padding-left:0px; margin-left:20px;}
/* footer */
footer{padding:15px 0 15px; clear:both; background-color:#000;color:#fff;}
footer .container{ padding:0 55px;}
footer p{font-size:12px; line-height:16px; text-align:center}
@media screen and (max-width: 767px) {
footer .container{ padding:0px 15px;}
}
@media screen and (min-width: 480px) {
footer p br{ display:none}	
}

#gotop {display:none;position: fixed;right: 30px;bottom: 60px;cursor: pointer;background:url(../images/icon_arrow.png) no-repeat left top;width:60px;height:60px;z-index:100!important;}
@media only screen and (max-width: 480px) {
#gotop {right: 15px;bottom: 30px;}
}


.hovereffect {
width:100%;
height:100%;
float:left;
overflow:hidden;
position:relative;
text-align:center;
cursor:default;
z-index:9;
}

.hovereffect .overlay {
width:100%;
height:100%;
position:absolute;
overflow:hidden;
top:0;
left:0;
opacity:0;
-webkit-transition:all .4s ease-in-out;
transition:all .4s ease-in-out;
z-index:10;
/*background:rgba(254,218,62,0.5);*/
background:url(../images/y-alpha.png) repeat-x left top;
}
.hovereffect .pic {
display:block;
position:relative;
z-index:8;
-webkit-transition:all .4s linear;
transition:all .4s linear;
}
.hovereffect a.info {
text-decoration:none;
display:inline-block;
text-transform:uppercase;
color:#fff;
border:1px solid #fff;
background-color:transparent;
opacity:0;
filter:alpha(opacity=0);
-webkit-transition:all .2s ease-in-out;
transition:all .2s ease-in-out;
margin:120px 0 15px;
padding:10px 20px 10px;
}

.hovereffect a.info:hover {
box-shadow:0 0 5px #fff;
}

.hovereffect:hover img {
-ms-transform:scale(9);
-webkit-transform:scale(1);
transform:scale(1);
}

.hovereffect:hover .overlay {
opacity:1;
filter:alpha(opacity=100);
}

.hovereffect:hover a.info {
opacity:1;
filter:alpha(opacity=100);
-ms-transform:translatey(0);
-webkit-transform:translatey(0);
transform:translatey(0);
}

.hovereffect:hover a.info {
-webkit-transition-delay:.2s;
transition-delay:.2s;
}


/*ad-banner*/
#abgne_float_ad {
    position: fixed;
    left: 50%;
    margin-left:22%;
    top:300px;
	z-index:999999;
	}
map *:focus{
outline:none;
}
@media (min-width: 768px) {
#abgne_float_ad {
    margin-left:25%;
    top:50px;
	}
}
@media (min-width: 1280px) {
#abgne_float_ad {
    margin-left:36%;
    top:250px;
	}
}
@media (min-width: 1440px) {
#abgne_float_ad {
    margin-left:40%;
    top:250px;
	}
}	
@media (min-width: 2000px) {
#abgne_float_ad {
    margin-left:30%;
    top:200px;
	}
}