@charset "utf-8";

/* 清除/原始設定 */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6,.h1,.h2,.h3,.h4,.h5,.h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, main, menu, nav, section, summary,
time, mark, audio, video{
	margin:0;
	padding:0;
}

article,aside,details,figcaption,figure,
footer,header,main,menu,nav,section{
	display:block;
}

body {
	background: #fff;
	font-family:"Noto Sans TC", "蘋方體", "思源黑體", "微軟正黑體", "Adobe 黑体 Std R", Arial, "TimesNew Roman", "Heiti TC Light", "Microsoft JhengHei", "Microsoft Sans Serif";
	margin:0;}

img {border: 0; width:100%;height:auto; vertical-align:bottom; display:block}
ul, li{list-style:none;}

a , a:hover , a:active,a:focus{outline: none; text-decoration: none;   -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;}
 
button, input{outline: none;}
input{outline: none;}
span {display: inline-block; word-break: break-all;}


/***** nav設定 *****/
.navbar,.apply-1,.navbar-bg{ height:52px;}
.navbar {margin-bottom: 0; background:#fff; border: 0; }
.navbar-nav{ margin:0}
ul.navbar-nav {	font-size:15px; font-weight:bold; letter-spacing:0; margin-left:10px; margin-right:2vw;}
/*text-transform: uppercase定義所有字母均為大寫*/
.navbar-fixed-top .navbar-collapse {max-height:600px;}
ul.navbar-nav li a {height:52px; line-height:28px; padding:auto 12px; color:#333; background:transparent;}

ul.navbar-nav li a:hover, ul.navbar-nav li a:focus
{color:#ffffff; background:#ebac39; outline:0;}

ul.navbar-nav li a.active, ul.navbar-nav li a:focus
{color:#333; background:transparent; outline:0; }

.navbar-brand {	width:20vw; height:45px; margin-top:5px; margin-left:5vw; background: url(../img/logo.png) no-repeat left; background-size:contain;}

.add-icon{ position:absolute; z-index:999;  cursor: pointer; width:70px; margin-left: calc(100% - 90px); margin-top:11px;}
.add-spc{ width:70px;}

@media (max-width:767px){
.navbar,.apply-1,.navbar-bg{ height:45px; min-height:45px;}
.navbar{ float: none;}
.navbar-collapse {float: none; padding:0; border: 0;}
.navbar-toggle {width:45px; border: none;  margin:3px 15px 0 0}
.icon-bar {height:45px; border: 2px solid #007c7d; }
ul.navbar-nav { margin:0;}
ul.navbar-nav li a {height:60px; padding:20px 8px; color:#fff ; background:#007c7d; text-align:center;}
ul.navbar-nav li a:hover, ul.navbar-nav li a:focus {color: #fff; background:#abcc73;}
.navbar-brand { width:50%; min-width:120px; height:36px; margin-top:6px; margin-left:5%;}
.navbar-toggle .icon-bar { position: relative;  transition: all 500ms ease-in-out;  -webkit-transition: all 500ms ease-in-out;}

.add-icon{ width:66px; margin-left: calc(100% - 130px); margin-top:9px;}
.add-spc{ display:none; width:0;}


/*第一條旋轉45度*/
.navbar-toggle.active .icon-bar:nth-of-type(1) {
  top: 6px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
/*第二條向左飛出*/
.navbar-toggle.active .icon-bar:nth-of-type(2) {
  opacity: 0;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}
/*第三條反轉45度*/
.navbar-toggle.active .icon-bar:nth-of-type(3) {
  top: -10px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
} 
}

/**** 影片淡入淡出 ****/
.carousel-fade .carousel-inner .item {
	transition-property: opacity;
	animation-timing-function:linear; 
}
.carousel-fade .carousel-inner .item,  
.carousel-fade .carousel-inner .active.left,  
.carousel-fade .carousel-inner .active.right {
   opacity: 0;
}
.carousel-fade .carousel-inner .active,  
.carousel-fade .carousel-inner .next.left,  
.carousel-fade .carousel-inner .prev.right {
    opacity:1;
}
.carousel-fade .carousel-inner .next,  
.carousel-fade .carousel-inner .prev,  
.carousel-fade .carousel-inner .active.left,  
.carousel-fade .carousel-inner .active.right {
    left: 0;
    transform: translate3d(0, 0, 0);
}
.carousel-fade .carousel-control {
    z-index: 2;
}

/***** 附加 *****/	
.applink{width: 100%; padding:25px 10% 10px;background:#E6E6E5;}
.app-icon{display:inline; width: 35px; padding:2px;}
.applink img{ vertical-align:middle}
.app-con{ font-size:16px; letter-spacing:1px; line-height:150%; text-align:center; margin-bottom:10px; }
.bank-app,.line-app{ display:inline-table;}
.line-app{ margin-left:15px}
hr{ margin:5px 0 10px; border-top: 1px solid #a8a89e;}

@media (max-width:767px) {
.applink{width: 100%; padding:25px 5% 5px;background:#E6E6E5;}
.app-con{ font-size:13px; letter-spacing:0;}
.app-icon{ width:27px;}
.bank-app,.line-app{ display:inline-table;}
.line-app{ margin-left:0; margin-top:8px}
}



/*****footer *****/
#footer{clear:both; width:100%; background:#E6E6E5;}
.foot-d {display:block; width:70%; margin-left:15%; padding-top:15px;padding-bottom:15px;}
.foot-m {display:none}

@media (max-width: 767px){
#footer{background:#e5e5e5;}
.foot-d {display:none;}
.foot-m {display:block; width: 86%; margin-left:7%; padding-top:20px;padding-bottom:50px;}
}


/*****新增BTN *****/
.icon-top {position: fixed; z-index:99; bottom:10px; width:52px; right:7px; cursor: pointer;}
.icon-right1 {position: fixed; z-index: 5; bottom:250px; width:71px; right:1px;}
.icon-right2 {position: fixed; z-index: 5; bottom:172px; width:71px;right:1px;}

@media (max-width: 767px){
.icon-top { width:50px; bottom:90px;right:2px;}
.icon-right1 { display:none;}
.icon-right2 { display:none;}
}