@charset "utf-8";
body {margin:0; padding:0; line-height:200%; font-size:15px; color:#333;font-family:"微軟正黑體";}
*{box-sizing:border-box;}
a{text-decoration:none;}
a:link, a:visited{ color:#333; }
a:hover, a:active{color:#666;}
#footer, .singlecontent, .singlecontent-l, produtdetail{float:left; height:auto; width:100%;}
.page{position:relative; height:auto; margin:auto auto; padding:auto auto;}
@media screen and (max-width:600px) {/*mobile*/
.page{width:100%;}
.logo{width:20%;}
/*pad and mobile menu*/
#header{width:100%; background:rgba(0,0,0,0.6); position:fixed; top:0; height:47px; z-index:100;}
.nav{width:100%; display:none;}	
.nav{
	height:auto;
	background:#111;
	text-align:center;
	position:absolute;
	top:43px;
	right:0;
	font-size:17px
}
.nav a{display:block; color:#ffa800; width:100%; border-top:1px solid #333; padding:7px; }
.nav a:hover{background:#ffa800; color:#000;}
/*desktop menu hidden*/
.nav-m{display:none;}
/*defaultimg*/
#defaultimg{width:100%; text-align:center; background:center; background-size:cover;  }
#defaultimg img{width:100%; margin:0 auto; padding-top:47px}
/*footer*/
.hide{ text-align:center; }
#footer{height:auto;  padding-top:0px;}
#footer .page{width:100%}
#footer .page div{margin-left:5%; width:90%; text-align:center;}
.add{text-align:center;padding-bottom:20px;}
.footerp{float:left; text-align:center; font-size:14px; padding-bottom:20px;}
.footerp2{float:left; text-align:center; font-size:14px;padding-bottom:20px;}
.call{ padding-bottom:10px;}
/*singlecontent width setting*/
.singlecontent .page, .singlecontent-l .page{width:90%;}
.singlecontent .page h1{ font-size:18px;}
.singlecontent-l .page h1{ font-size:18px;}
.singlecontent-l .page h2{ color:#ffa800; font-size:16px;}
/**/
.side{width:100%;}
.main{width:100%;}
.side h2{display:none;}
/*submenu*/
#submenu{ border:1px solid #ccc;}
.subnav{display:none;}
.subnav a{ border-top:1px dotted #ccc; text-align:left;}
/*product*/
.product{width:96%;}
.productside{width:100%;}
.productmain{width:100%;}
/*news*/
.newslist h3{font-family:"微軟正黑體"; font-weight:normal; font-size:16px; width:100%; color:#000; margin:0; padding:0;}
.default_h7{font-family:"微軟正黑體"; font-weight:normal; font-size:20px; width:100%; color:#000; margin:0; padding:0;}
.newslist img{width:50%; height:auto; float:left; margin:0 2% 0 0;}

	}

@media screen and (min-width:600px) and (max-width:1200px){/*pad*/

.page{width:100%;}
.logo{width:30%;}
/*menu menu hidden*/
.toggle, .nav{display:none;}
/*desktop menu*/
#header{width:100%; background:rgba(0,0,0,0.6); position:fixed; top:0; height:68px; z-index:100;}
.nav-m{height:auto;  text-align:center; position:absolute; top:0 ; left:370px; float:left; }
.nav-m a{display:block;  color:#ffa800; float:left; font-size:15px; padding:19px 15px 19px 15px;}
.nav-m a:hover{background:#ffa800; color:#000;}
/*defaultimg*/
#defaultimg{ width:100%; text-align:center; float:left; background:center; background-size:cover;  }
#defaultimg img{width:100%; height:auto; }
/*footer*/
.hide{width:85%;float:left; }
#footer{height:180px;  padding-top:30px;}
#footer .page{width:960px;float:left; }
#footer .page div{margin-left:0px;}
.add{float:left; text-align:left;  font-size:13px; padding:5px 10px 0px 0px ;}
.footerp{float:left; text-align:left;  font-size:13px;}
.footerp2{float:left; text-align:left;  font-size:13px; }
.call{float:left;width:80%;}
/*singlecontent width setting*/
.singlecontent .page, .singlecontent-l .page {width:90%;}
/**/
.side{width:25%;}
.main{width:70%;}
/*submenu*/
.subtoggle{display:none;}
.subnav{display:block;}
.subnav a{ border-bottom:1px dotted #ccc;  text-align:left;}
/*product*/
.product{width:46%;}
.productside{width:35%; }
.productmain{width:60%;}
/*news*/
.newslist h3{font-family:"微軟正黑體"; font-weight:normal; font-size:18px; width:100%; color:#000; margin:0; padding:0; font-weight:bold; }
.newslist img{width:25%; height:auto; float:left; margin:0 2% 0 0;}

}


@media screen and (min-width:1200px){/*desktop*/
#defaultimg{width:100%; height:348px; float:left; background:center; text-align:center; background-size: cover;}
/*menu menu hidden*/
.toggle, .nav{display:none;}
.nav{display:none;}
/*desktop menu*/
#header{width:100%; background:rgba(61,124,185,0.6); position:fixed; top:0; height:68px; z-index:100;}
.nav-m{height:auto;  text-align:center; position:absolute; top:0; right:0; width:60%;}
.nav-m a{ display:block; color:#FFF;  float:left; font-size:15px; padding:19px 5px 19px 5px; }
.nav-m a:hover{ background:#ffa800; color:#004c81; }
/*footer*/
#footer{height:180px;  padding-top:30px;}
#footer .page{width:1200px;}
#footer .page div{margin-left:38px;}
.add{float:left; text-align:left;  font-size:14px; padding-top:5px;}
.footerp{float:left; text-align:left;  font-size:14px;}
.footerp2{float:right; text-align:left;  font-size:14px;}
/*singlecontent width setting*/
.singlecontent .page, .singlecontent-l .page {width:1200px;}
/**/
.side{width:20%;}
.main{width:75%;}
/*submenu*/
.subtoggle{display:none;}
.subnav{display:block;}
.subnav a{ border-bottom:1px dotted #ccc; text-align:left;}
/*product*/
.product{width:29%;}
.productside{width:35%; }
.productmain{width:60%;}
/*news*/
.newslist h3{font-family:"微軟正黑體"; font-weight:normal; font-size:18px; width:100%; color:#000; margin:0; padding:0; font-weight:bold; }
.newslist img{width:25%; height:auto; float:left; margin:0 2% 0 0;}


}

/*header*/
#header .page{width:1200px;}
#defaultimg{overflow:hidden;}
/*footer*/
#footer{background:#004c81; color:#fff; }
#footer .page div{float:left; text-align:center;}
/*click bottom*/
a.btn:link, a.btn:visited{padding:5px 10% 5px 10%; background:#ffa800; text-align:center; color:#000; border-radius:5px;}
a.btn:hover, a.btn:active{color:#fff; background:#333;}
a.btn1:link, a.btn1:visited{display:block; width:105px; height:auto; padding:5px; font-size:15px; color:#fff; text-align:center; border-radius:5px; background:#ffa800; font-family:Arial, Helvetica, sans-serif;  border:solid #ffa800 1px}
a.btn1:hover, a.btn1:active{color:#fff; background:#333; border:solid #CCC 1px}
a.btn2:link, a.btn2:visited{display:block; width:80px; height:auto; padding:5px; font-size:15px; color:#fff; text-align:center; border-radius:5px; background:#ffa800; font-family:Arial, Helvetica, sans-serif; float:right;}
a.btn2:hover, a.btn2:active{color:#fff; background:#333;}

/*----內頁用 start----*/
h1{width:100%; height:auto; text-align:center; float:left; font-family:"微軟正黑體"; font-weight:normal; color:#333;padding:1%; border-bottom:1px solid #ccc; font-size:28px;}
.side h2{font-family:"微軟正黑體"; color:#fff; background:#ffa800; margin-bottom:0; padding:10px 0 10px 0; text-align:center;}
/*content r*/
.side{height:auto;  float:left;}
.main{height:auto;  float:right;}
.singlecontent-l .side{height:auto; float:right;}
.singlecontent-l .main{height:auto; float:left;}
.singlecontent, .singlecontent-l{margin-bottom:30px;}
.singlecontent .page, .singlecontent-l .page, .productdetail .page{height:auto; position:relative; margin:auto auto; padding:auto auto;}
.singlecontent .page img, .singlecontent-1 .page img{max-width:100%;}
.singlecontent p, .singlecontent-l p{margin-bottom:40px;}


/*副選單*/
#submenu{width:100%; height:auto; float:left; border-radius:5px; margin-bottom:10px;}
#submenu a{display:block; width:100%; height:auto; padding:10px; float:left; box-sizing:border-box; color:#666;}
#submenu a:hover{background:#efefef; color:#333;}

/*products*/
.product{height:auto; float:left; font-size:13px; margin:2%; border-bottom:1px dotted #ccc;}
.product:hover{background:#efefef;}
.product div{width:90%; height:90%; float:left; overflow:hidden; margin:5%; background-repeat:no-repeat; background-size:40% 40%;}
.product h3 {font-size:18px; width:90%; height:auto; margin:0 5% 0 5%; color:#C60; font-family:"微軟正黑體"; font-weight:normal; text-align:center;}
.product p{color:#666; width:90%; height:auto; margin:0 5% 0 5%; padding:0;}
.productimg-s{width:33%; height:auto; float:left; overflow:hidden;}
.productimg-s img:hover{border:1px solid #F90;}
.productimg-s img{width:90%; height:auto; margin:5%; border:1px solid #ccc;}
.productside{float:right; height:auto;}
.productmain{float:left; height:auto;}
.productmain h2{font-family:"微軟正黑體"; font-weight:normal;}
.productmain h3{
	font-family:"微軟正黑體";
	font-weight:normal;
	font-size:16px;
	width:100%;
	height:auto;
	color:#000;
	background: #eee;
	padding: 1% 0 1% 2%;
}

/*news*/
.newslist{border-bottom:1px dotted #ccc; float:left; width:100%; height:auto; padding:15px 0px 15px 0px;}

/*input frame*/
.inputframe{height:auto;  padding:10px; text-align:left;}
.inputframe input{height:30px; width:100%;}
.inputframe textarea{width:98%;}
select{height:auto; width:100%;}

h7{font-family:"微軟正黑體"; font-size:28px;}
.form {
	padding: 3px;
	border: 1px solid #ccc;
	border-radius:5px;
}
.bgDots {
	font-family: "微軟正黑體";
	font-size: 15px;
	color: #333;
	text-decoration: none;
}
.bgDots a {
	color: #333;
	text-decoration: none;
}
.bgDots a:hover {
	color: #000;
}

.bottom a{text-decoration:none;}
.bottom a:link, a:visited{ color:#fff; }
.bottom a:hover, a:active{ color:#999;}