@import url('https://fonts.googleapis.com/css?family=Anton|Noto+Sans+TC');
.text-border-black, .黑框字{text-shadow:-1px 0 rgba(41,50,58,1), 0 1px rgba(41,50,58,1), 1px 0 rgba(41,50,58,1), 0 -1px rgba(41,50,58,1);}
.text-border-white, .白框字{text-shadow:-1px 0 #FFF, 0 1px #FFF, 1px 0 #FFF, 0 -1px #FFF;}
/*----------------------------------------------------------- 
GLOBAL STYLES
-----------------------------------------------------------*/
*{
  font-family:'Noto Sans TC', 'Lucida Sans Unicode','Trebuchet MS',Verdana,Arial,黑體,宋體,微軟正黑體,新細明體;
  outline:none;
  box-sizing:border-box;
  transition:
    top 0.5s ease,
    left 0.5s ease,
    right 0.5s ease,
    height 0.5s ease,
    width 0.5s ease,
    opacity 0.5s ease,
    background-image 0.5s ease,
    background-color 0.5s ease,
    background-position 0.5s ease,
    margin 0.5s ease-out,
    padding 0.5s ease-out;
  -webkit-transition:
    top 0.5s ease,
    left 0.5s ease,
    right 0.5s ease,
    height 0.5s ease,
    width 0.5s ease,
    opacity 0.5s ease,
    background-image 0.5s ease,
    background-color 0.5s ease,
    background-position 0.5s ease,
    margin 0.5s ease-out,
    padding 0.5s ease-out;
  -moz-transition:
    top 0.5s ease,
    left 0.5s ease,
    right 0.5s ease,
    height 0.5s ease,
    width 0.5s ease,
    opacity 0.5s ease,
    background-image 0.5s ease,
    background-color 0.5s ease,
    background-position 0.5s ease,
    margin 0.5s ease-out,
    padding 0.5s ease-out;
}

body{
	color:rgba(51,51,51,1);
	font-size:;
	background:rgba(245,245,245,1);
	overflow-x:hidden;
}

.sticky{
	position:-webkit-sticky;
	position:sticky;
	bottom:0;
	background:rgba(41,50,58,1);
	/*background:rgba(0,0,0,1);*/
	padding:12px;
	text-align:right;
	font-size:9pt;
	color:#FFF;
}

.sticky-100{
	z-index:100;
}

.pt-130{
	padding-top: 130px;
}

.text-outline-black{text-shadow: -1px 0 #000, 1px 0 #000, 0 -1px #000, 0 1px #000;}
.text-outline-black-shadow{text-shadow: -1px 0 #000, 1px 0 #000, 0 -1px #000, 0 1px #000,3px 3px 3px rgba(0,0,0,0.75) !important;}
.text-outline-white{text-shadow: -1px 0 #FFF, 1px 0 #FFF, 0 -1px #fff, 0 1px #FFF;}
.text-outline-white-shadow{text-shadow: -1px 0 #FFF, 1px 0 #FFF, 0 -1px #fff, 0 1px #FFF,3px 3px 3px rgba(0,0,0,0.75) !important;}

.fs-1w{font-size: 1vw;}
.fs-2w{font-size: 2vw;}
.fs-3w{font-size: 3vw;}
.fs-4w{font-size: 4vw;}
.fs-5w{font-size: 5vw;}
.fs-6w{font-size: 6vw;}
.fs-7w{font-size: 7vw;}
/*----------------------------------------------------------- 
navigator
-----------------------------------------------------------*/
.navbar{
	/*overwrite bootstrap*/
	padding:0;
	background:rgba(41,50,58,0.6);	/*目錄底色*/
}

.navbar-brand {
	width:100px;
}

.navbar-expand-lg .navbar-nav .nav-link {
	color:#FFF;
	padding:0 22px;
	margin-top:20px;
	margin-bottom:20px;
	line-height:40px;
	border-radius:30px;
	background:transparent;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	transition:all 0.3s ease-in-out;
}

.navbar-expand-lg .navbar-nav li a{
	border-top:rgba(0,72,79,0) 2px dotted;	/*目錄項目底色*/
	border-bottom:rgba(0,72,79,0) 2px dotted;	/*目錄項目底色*/
}

.navbar-expand-lg .navbar-nav li a:hover,
.navbar-expand-lg .navbar-nav li .active > a{
	color:#FFF;
	border-top:rgba(0,72,79,1) 2px dotted;	/*目錄項目底色*/
	border-bottom:rgba(0,72,79,1) 2px dotted;	/*目錄項目底色*/
}

.navbar .nav-link.active {
	color:#fff !important;
	background:rgba(0,72,79,1);
}

.dropdown-toggle::after {
	display:none;
}

.slicknav_btn {
	border-color:rgba(2,151,255,0);
}


.slicknav_open .slicknav_icon-bar:nth-child(1){
	transform-origin:50% 50%;
	transform:translateY(8px) rotate(45deg);
}

.slicknav_open .slicknav_icon-bar:nth-child(2){
	opacity:0;
}

.slicknav_open .slicknav_icon-bar:nth-child(3){
	transform-origin:50% 50%;
	transform:translateY(-8px) rotate(135deg);
}

.slicknav_menu .slicknav_icon-bar {
  background:rgba(255,255,255,1);
}

/* only small tablets */
@media (min-width:768px) and (max-width:991px) {
  #nav-main li a.nav-link {
    padding-top:18px;
  }
}

.navbar-toggler {
  display:none;
}


/*----------------------------------------------------------- 
footer
-----------------------------------------------------------*/
footer{
	border-top:#FFF 2px solid;
	background:rgba(41,50,58,1);
	background-position:center center;
	background-size:cover;
	background-repeat:no-repeat;
	width:100%;
	color:#DDD;
	padding:20px;
}

footer ul{
	list-style:none;
	padding-left:0
}

footer li a,
footer li a:hover{
	color:#fff;
	width:100%;
}

footer .copy-footer{
	border-top:1px solid #fff;
	padding-top:20px;
	margin-top:10px;
}


/*----------------------------------------------------------- 
RESPONSIVE CSS
-----------------------------------------------------------*/
@media (min-width:769px){
	/*xl*/
	.mobile{display:none;}
	.laptop{display:block;}
	
	.service-sec{
		padding-top:100px;
	}

	.video-background{
		min-width:100%;
		min-height:100%;
		width:100vw;
		height:auto;
	}

	.mobile-menu {
		display:none;
	}

	.slicknav_menu {
		display:none;
	}
}

@media (max-width:768px){
	/*sm*/
	.mobile{display:block;}
	.laptop{display:none !important;}
	.laptop.d-flex{display:none !important;}
	
	.top-bar .navbar-nav{
		width:100%;
		//background:#0C242E;
		margin-top:20px;
	}

	.collapsing{
		transition-duration:0s;
		overflow:none;
	}

	h2{
		font-size:8vw;
		font-weight:800;
		color:rgba(41,50,58,1);
	}
}

@media screen and (max-width:768px) {
  .navbar-header {
    width:100%;
  }
  .navbar-brand {
    position:absolute;
    padding-left:21px;
    top:0;
  }

  .slicknav_menu {
    display:block;
  }

  .slicknav_nav .active a {
    background:#61D2B4;
    color:#fff;
  }
  .slicknav_nav a:hover, .slicknav_nav .active {
    color:rgba(0,72,79,1);
    background:#f8f9fa;
  }
  .slicknav_nav .dropdown li a.active {
    background:#f8f9fa;
    color:rgba(0,72,79,1);
  }
  .slicknav_nav .nav-item{
  	border-bottom:#DDD 1px dotted;
  	color:#FFF;
  }
}