@charset "utf-8";
/* CSS Document */
body {
	color: #000;
	font-size: 14px;
	line-height: 180%;
	font-family: custom-sans-serif;
}
@font-face {
	font-family: custom-sans-serif;
    src: local("Heiti TC"), local("微軟正黑"), local("Microsoft JhengHei");
	unicode-range: U+4E00-9FFF;
}
@font-face {
	font-family: custom-sans-serif;
	src: local(Helvetica), local(Segoe UI);
	unicode-range: U+00-024F;
}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto {
	padding: 0px;
}
.container-fluid, .container-sm, .container-md, .container-lg, .container-xl{
	padding:0px 24px;
}
.row {
	margin: 0px;
}
a {
	color: #fff;
}
a:hover {
	text-decoration: none;
}
.animated-arrow {
	cursor: pointer;
	width: 56px;
	height: 56px;
	display: none;
	position: absolute;
	left: 0px;
	top: 0px;
}
.animated-arrow.menuopen{
	margin-bottom: 12px;
}
.animated-arrow span{
	top:28px;
}
.animated-arrow.menuopen span{
	top:22px;
}
.animated-arrow span, .animated-arrow span:before, .animated-arrow span:after {
	cursor: pointer;
	height:2px;
	width:25px;
	background: #da251d;
	position: absolute;
	display: block;
	content: '';
}
.animated-arrow span:before{
	top: -7px;
}
.animated-arrow span:after {
	bottom: -7px;
}
.animated-arrow span, .animated-arrow span:before, .animated-arrow span:after{
	transition: all 500ms ease-in-out;
}
.animated-arrow.menuopen span{
	background-color: transparent;
}
.animated-arrow.menuopen span:before, .animated-arrow.active span:after{
	top:7px;
}
.animated-arrow.menuopen span:before {
	transform: rotate(45deg);
	-moz-transform:  rotate(45deg);
	-ms-transform:  rotate(45deg);
	-o-transform:  rotate(45deg);
	-webkit-transform:  rotate(45deg);
	bottom:0px;
}
.animated-arrow.menuopen span:after {
	transform: rotate(-45deg);
	-moz-transform:  rotate(-45deg);
	-ms-transform:  rotate(-45deg);
	-o-transform:  rotate(-45deg);
	-webkit-transform:  rotate(-45deg);
}
.navbar {
	background-color: #fff;
	padding: 0px 42px;
	height: 64px;
	-webkit-box-shadow: 3px 3px 5px #999;
	-moz-box-shadow: 3px 3px 5px #999;
	box-shadow: 3px 3px 5px #999;
}
.navbar-logo{
	width:180px;
}
.nav-link {
	padding: 1rem 1rem;
}
.navbar-logo img {
	width: 100%;
}
.navbar-menu {
	list-style: none;
	padding: 0px;
	margin: 0px;
	font-weight:bold;
	font-size:1.3em;
}
.navbar-menu .nav-item{
	display:inline-block;
	position:relative;
}
.navbar-menu .nav-item a{
	color:#333;
}
.navbar-menu .nav-item a:hover{
	color:#da251d;
}
.navbar-menu .nav-item .dropdown-menu{
	display:none;
	font-size:11px;
	line-height:120%;
	padding:0px;
	margin:0px;
	min-width:158px;
	background-color:transparent;
}
.navbar-menu .nav-item .dropdown-menu ul {
	list-style: none;
	padding: 0px;
	margin: 0px 0px;
	background-color: rgba(0,0,0,.9);
}
.navbar-menu .nav-item:hover .dropdown-menu{
	display:block;
}
.navbar-menu .nav-item .dropdown-menu ul li{
	padding:6px 0px;
}
.navbar-menu .nav-item .dropdown-menu ul li:hover {
	background-color: #da251d;
}
.navbar-menu .nav-item .dropdown-menu ul li a{
	padding:2px 6px;
	display:block;
	color:#fff;
}
.container-fluid {
	margin: 0px;
	padding: 0px;
}
.container-banner{
	position:relative;
}
.container-banner img {
	width: 100%;
}
.flex-control-paging li a.flex-active {
	background: #da251d;
}
.container-main {
	position: relative;
}
.container-sec {
	padding: 24px 0px;
	color: #fff;
	background-color:#182e6a;
}
.sec-box {
	max-width: 1400px;
	min-height:80px;
	margin:24px auto;
}
.sec-left {
	width: 15%;
	display: inline-block;
	vertical-align: top;
	margin: 0px -2px;
	padding: 24px 2px;
}
.left-menu{
	border: 1px solid #444;
	padding: 15px 25px 25px 25px;
}
.left-menu ul {
	list-style: none;
	padding: 0px;
	margin: 0px;
}
.left-menu ul li{
	border-bottom: 1px solid #444;
	padding:6px 0px;
}
.left-menu a {
	color: #fff;
}
.left-menu a:hover {
	color: #fff;
}
.sec-right {
	width: 85%;
	display: inline-block;
	vertical-align: top;
	margin: 0px -2px;
	padding: 0px 2px;
}
.sec-title h1 {
	font-size: 36px;
	text-transform: capitalize;
	color: #fff;
	font-weight: 700;
	text-align: center;
}
.border-bottom {
	width: 50px;
	height: 4px;
	background: #da251d;
	margin: 0 auto;
	border-bottom: 0px solid #da251d !important;
}
.breadcrumb-list {
	text-align: center;
	padding:12px 0px;
}
.breadcrumb-list li:first-child {
    padding-left: 0;
}
.breadcrumb-list li {
    display: inline-block;
    position: relative;
    padding: 0 14px;
}
.breadcrumb-list li:before {
    content: "/";
    position: absolute;
    right: -4px;
    font-size: 16px;
    font-weight: 600;
    top: 0;
    color: #fff;
}
.breadcrumb-list li:last-child:before {
    content: " ";
}
.breadcrumb-list li a {
    font-weight: 600;
    text-transform: capitalize;
    color: #fff;
}
.tab-list{
	padding:12px;
}
.tab-list ul{
	list-style:none;
	padding:0px;
	margin:0px;
	text-align:center;
}
.tab-list ul li{
	display:inline-block;
	padding:0px 6px;
	font-weight:bold;
}
.tab-list ul li a{
	color:#888;
	padding:6px;
}
.tab-list ul li a:hover{
	color: #feb406;
}
.tab-list ul li a.active{
	color: #fff;
	border-bottom:solid 2px #feb406; 
}
.sec-text {
	padding: 24px 24px 24px 24px;
}
.products-list {
	padding: 24px 12px 48px 12px;
}
.products-list ul{
	list-style:none;
	padding:0px;
	margin:0px;
	vertical-align:top;
}
.products-list ul li{
	width:25%;
	display:inline-block;
	margin:0px -2px;
	padding:0px 2px;
	vertical-align:top;
}
.products-list ul li .products-group{
	padding:0px 12px 24px 12px;
}
.products-list ul li .pic{
	display:block;
	background-color:#fff;
}
.products-list ul li .pic img{
	width:100%;
}
.products-list ul li .name{
	display:block;
}
.products-list ul li a{
	color:#fff;
}
.products-list ul li a:hover{
	color:#fff;
}
.quality-list {
	padding: 24px 12px 48px 12px;
}
.quality-list ul{
	list-style:none;
	padding:0px;
	margin:0px;
	vertical-align:top;
}
.quality-list ul li{
	width:25%;
	display:inline-block;
	margin:0px -2px;
	padding:0px 2px;
	vertical-align:top;
}
.quality-list ul li.quality1{
	width:25%;
}
.quality-list ul li.quality2{
	width:25%;
}
.quality-list ul li .quality-group{
	padding:0px 12px 24px 12px;
}
.quality-list ul li .pic{
	display:block;
	background-color:#fff;
}
.quality-list ul li .pic img{
	width:100%;
}
.contact-group{
	vertical-align:top;
	margin:0px 0px 24px 0px;
}
.contact-group .contact-left{
	width:30%;
	display:inline-block;
	margin:0px -2px;
	padding:0px 2px;
	vertical-align:top;
}
.contact-group .contact-left img{
	width:100%;
}
.contact-group .contact-left .pic{
	padding:12px 24px;
}
.contact-group .contact-right{
	width:70%;
	display:inline-block;
	margin:0px -2px;
	padding:0px 2px;
	vertical-align:top;
}
.contact-group .contact-right .info{
	padding:12px 24px;
}
.contact-group .contact-right .info a{
	color:#fff;
}
/* footer */
.footer-container {
	font-size: 9px;
	vertical-align: middle;
	text-align: center;
	background-color:#05102f;
	color: #fff;
	position: relative;
	padding: 0px 0px;
}
.footer-shape {
	background: #6f1c18;
	height: 10px;
	width: 100%;
}
.footer-info {
	text-align: center;
	padding: 48px 24px 48px 24px;
	vertical-align: top;
}
.footer-info .fAddress {
	display:inline-block;
	vertical-align: top;
	text-align:left;
	width:20%;
	background: url(../images/footer-map-marker.png) no-repeat;
	background-size:35px auto;
	min-height: 42px;
	padding: 0px 0px 0px 52px;
	color: #8a959f;
	font-size: 1.5em;
	margin:0px 5%;
}
.footer-info .fPhone {
	display:inline-block;
	vertical-align: top;
	text-align:left;
	width:20%;
	background: url(../images/footer-phone.png) no-repeat;
	background-size:35px auto;
	min-height: 42px;
	padding: 0px 0px 0px 52px;
	color: #8a959f;
	font-size: 1.5em;
	margin:0px 5%;
}
.footer-info .fEmail {
	display:inline-block;
	vertical-align: top;
	text-align:left;
	width:25%;
	background: url(../images/footer-envelop.png) no-repeat left -5px;
	min-height: 42px;
	padding: 0px 0px 0px 52px;
	color: #8a959f;
	font-size: 1.5em;
	margin:0px 5%;
}
.footer-info .fEmail a{
	color: #8a959f;
}
.footer-info .fEmail span{
	display:block;
}
.footer-copyright {
	padding: 48px 0px 48px 0px;
	border-top: 1px solid #3f5161;
	text-align: center;
}
@media screen and (max-width: 982px) {
	.products-list ul li {
		width: 33.3%;
	}
}
@media screen and (max-width: 782px) {
	body {
		font-size: 13px;
	}
	.navbar {
		padding: 0px 12px;
	}
	.animated-arrow {
		display: block;
	}
	.navbar-logo{
		margin:0px auto;
	}
	.navbarCollapse{
		display:none;
		position:absolute;
		z-index:100;
		background-color:#efefef;
		left:0px;
		top:64px;
		width:100%;
	}
	.mobileActive .navbarCollapse {
		display:block;
	}
	.navbar-menu .nav-item{
		display:block;
		width:100%;
		border-bottom:solid 1px #ccc;
		overflow:hidden;
	}
	.navbar-menu .nav-item .dropdown-menu{
		display:block;
		position:relative;
		width:100%;
	}
	.navbar-menu .nav-item .dropdown-menu ul{
		vertical-align:top;
	}
	.nav-link {
		padding: 0.4rem 0.4rem;
	}
	.container-fluid, .container-sm, .container-md, .container-lg, .container-xl {
		padding: 0px 0px;
	}
	.sec-left {
		display:none;
	}
	.sec-right {
		display:block;
		width:100%;
	}
	.products-list ul li {
		width: 50%;
	}
	.quality-list ul li,
	.quality-list ul li.quality1,
	.quality-list ul li.quality2{
		width:50%;
	}
	.contact-group .contact-left,
	.contact-group .contact-right {
		width: 100%;
		display: block;
		margin: 0px 0px;
		padding: 0px 0px;
	}
	.footer-info .fAddress {
		display: block;
		width: 100%;
		margin: 0px 0px 24px 0px;
	}
	.footer-info .fPhone {
		display: block;
		width: 100%;
		margin: 0px 0px 12px 0px;
	}
	.footer-info .fEmail {
		display: block;
		width: 100%;
		margin: 0px 0px 12px 0px;
	}
}
@media screen and (max-width: 482px) {
	body {
		font-size: 12px;
	}
	.products-list ul li {
		width: 100%;
	}
	.quality-list ul li,
	.quality-list ul li.quality1,
	.quality-list ul li.quality2 {
		width: 100%;
	}

}