@charset "utf-8";
body{font-family: 'Noto Sans TC', sans-serif; font-weight: 300; letter-spacing: 1px; color: #777676}

a{color: #FFF; text-decoration-line: none;}

.container{ max-width: 1000px; margin: 0 auto;}

header .container{
	display: flex; /*下一層不換行(向橫發展) 如需換行需配合flex-wrap*/
	justify-content: space-between; /*間距自設 左右對齊 ，需配合Display:flex使用*/ }

header{position: fixed;background: #777676;z-index: 50;	width: 100%;}

header .logo {}

header .logo img{width: 350px;margin: 5px 15px;}

header .icon , .menu {display: none;}

header ul{display: flex; margin-top: 30px;}

header ul li{margin:0 15px; font-size: 14px; letter-spacing: 2px;}

header ul li a:hover{ 
	border-bottom: solid 2px #FFF; padding-bottom: 3px}

.banner img{width: 100%;margin-top: 50px;}

h1{font-family: 'Montserrat', sans-serif; font-size: 64px; text-align: center; letter-spacing: 2px; margin-top: 140px;}

h2{  padding: 5px; text-align: center; font-size: 36px; font-weight: 400; letter-spacing: 7px; 
	margin-top:5px;}


h3{font-size: 22px; background-color:#980306; color: #FFF; text-align: center; padding: 10px 60px; font-weight: 300; letter-spacing: 2px; line-height: 150%; margin-top: 0px;}
h4{font-size: 15px;background-color: #777676; color: #FFF; text-align: center; padding: 10px 60px; font-weight: 200; letter-spacing: 3px; line-height: 150%; margin-top: 0px;}
h5{text-align: center;  color: #980306; font-size: 40px; font-weight: 300; letter-spacing: 3px; 
	margin-top:130px;}


.banner2 img{width: 100%;margin-top: 150px; }


.oem img{width: 100%;margin-top: 60px;}

.prod img{margin-top: 60px;}



h6 {text-align: center; color: #777676; line-height: 180%; padding: 0 40px; letter-spacing: 3px;margin-top: 20px;margin-bottom: 60px;}

.pro{display: flex; justify-content:center;padding: 0 10px;}

.pro ul {margin: 15px 50px 0px 50px;}

.pro li {list-style:square; font-size: 19px; color: #777676; margin-top: 15px; letter-spacing: 3px;}

.product_info{ margin-top: 50px; margin-bottom: 50px; padding: 0 20px;border-bottom: dashed 1px #E3E3E3; padding-bottom: 50px;}

.product_img{float: right;width: 30%;}

.product>*{margin: 2px 0px;line-height: 130%;}

.product .product_code,.product_ename,.product_ml{color: #820002; font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";}

.product .product_name{color: #820002;}

.product_ml {border-bottom: solid 1px #820002; padding-bottom: 9px;}

.fucc,.fuce{margin-top: 5px; font-size: 14px; letter-spacing: 1;}

.product_fuc,.product_ing{margin-top: 15px; color: #820002;}

.m_product_info{display: none;}

.contact{display: flex; justify-content: space-between; padding: 0 20px;margin-top: 50px;}

.address {width: 50%;}

.address li{list-style: none;line-height: 160%;margin-top: 20px;}

.address h5,#form h5{text-align: left; margin-top: 0px; letter-spacing: 0;font-size: 24px;}

.tel{color: #777676}

#form h5{margin-bottom: 30px;}

#form{
	margin-left:100px;
	width:50%;
}

fieldset{
	margin-bottom: 20px;
}
fieldset label{
	display: block;
	margin-bottom: 4px;
}
input[type=text],input[type=password],textarea{
	width:100%;
	padding:8px;
	font-size: 1em;
	border:solid 1px #999;
	color:#666;
}
textarea{
	height: 100px;
}
.btns>input,.btns>a{
	background-color: transparent;
	border:solid 1px #999;
	padding:10px 15px;
	font-size: 1em;
	display: inline-block;
	text-decoration: none;
	cursor: pointer;
	color:#666;
	line-height: 130%;
}
.btns>input:hover,.btns>a:hover{
	background-color: #999;
	color:#FFF;
}
.form-error{
	color:#F00;
	font-size: 14px;
	letter-spacing: 0;
}

footer .container{ margin-top: 10px; margin-bottom: 10px;}

footer .border{ border-top: solid 1px #777676; padding-top: 20px; margin-top: 100px;}

footer span{ margin: 30px 0px;}

footer a{font-size: 15px; color: #777676; margin-right: 30px;}

footer .copy{font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";font-size: 15px; margin-top: 0px; letter-spacing:1px; float: right;}













@media (max-width:800px){
	.container{width: 100%;}
	
	header .logo img{width: 250px;padding: 0px 0; padding-left: 10px;}
	
	header .icon{display: block; padding-top: 13px; padding-right: 20px; cursor:pointer;}
	
	header .icon img{width: 25px; height: 25px;}
	
	.menu1{display: none;}
	
	.menu{  text-align: center;
       background-color:rgba(255,255,255,1); width: 100%; height: 100%; z-index: 51; position: fixed;}
	
	.menu ul{margin-top: 80px;}
	
	.menu ul li { border-bottom: solid 1px #777676; padding:10px 0; }
	
	.menu ul li a{color: #777676;text-decoration-line:none; font-size: 18px;}
	
	.menu .icon{padding-top: 13px;float: right; margin-right: 20px;}
	
	.menu .icon img{width: 25px; height: 25px; }
	
	.banner img{margin-top: 50px;}
	
	
	h1{font-family: 'Montserrat', sans-serif; font-size: 30px; text-align: center; letter-spacing: 2px; margin-top: 140px;}

	h2{  text-align: center; font-size: 20px; font-weight: 300; letter-spacing: 3px; 
	margin-top:3px;}

	h3{font-size: 16px; background-color:#980306; color: #FFF; text-align: center; padding: 13px 20px; font-weight: 300; letter-spacing: 1px; line-height: 140%; margin-top: 0px;}
	h4{
	font-size: 13px;
	background-color: #777676;
	color: #FFF;
	text-align: justify;
	padding: 10px 20px;
	font-weight: 200;
	letter-spacing: 2px;
	line-height: 140%;
	margin-top: 0px;
}
	
	
	h5{text-align: center;  color: #980306; font-size: 22px; margin-top:70px;padding: 0 20px;}

	h6 {
	text-align: justify;
	font-size: 14px;
	line-height: 170%;
	padding: 0 20px;
	margin-top: 20px;
	margin-bottom: 40px;
	letter-spacing: 4px;
}
	
	.banner2 img{width: 100%;margin-top: 130px; }
	
	
	
	
	.prod img{margin-top:30px;}
	.oem img{margin-top: 40px;}
	#probanner{margin-bottom: 20px;}
	
	.pro{flex-wrap: wrap;}

.pro ul {margin:0px; text-align: center;}

.pro li {list-style:none;font-size: 16px; color: #777676; margin-top: 9px; letter-spacing: 2px; line-height: 130%;}
	
.product_info{display: none;}

.m_product_info{display: block; font-size: 14px; padding: 0 20px; text-align: center; line-height: 140%; margin-top: 50px;border-bottom: dashed 1px #E3E3E3; padding-bottom: 50px;}
	
.m_product_img {margin: 30px 0px;}	
	
.m_product_img img{height: 200px; display:block; margin:auto;}
	
.m_product_ing, .m_product_fuc{margin-top: 16px; color:#820002; }	
	
.m_product_ename,.m_product_ml,.m_fuce{font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"; font-size: 13px;}

	.m_product_ml{border-bottom: solid 1px #820002; padding-bottom: 9px;}

.m_product_code,.m_product_name,.m_product_ename,.m_product_ml{color:#820002; font-size: 16px;margin: 5px 0;}

.contact{display: block;}	

.address{width: 100%; padding: 20px;text-align: center;border-bottom:dashed 1px #820002; padding-bottom: 60px;}
	
.address li{list-style: none;line-height: 160%;margin-top: 10px;}	
	
.address h5,#form h5{text-align: center; margin-top: 0px; letter-spacing: 0;font-size: 24px;}
	
.news {margin-top: 0px; margin-bottom: 300px;}
	
#form{
	margin:0px;
	width:100%;
}	

	#form h5{margin-top: 60px;}
	
footer .container{ margin-top: 10px; margin-bottom: 10px;}

footer .border{ border-top: solid 1px #777676; padding-top: 20px; margin-top: 50px;}

footer span{ display:  none;text-align: center;}



footer .copy{display: block; margin-top: 0px; letter-spacing:1px; font-size: 14px; text-align: center;float: none;bottom: 0;}

}