@charset "utf-8";

body {

	margin: 0px auto;

	padding: 0px;

	text-align: center;

	font-size: 14px;

    line-height:1.6;

	font-family:Arial, "微軟正黑體", "Microsoft JhengHei";

	color:#FFF;

	background:#111;

}

h1, h2, h3, h4, h5, h6, strong { font-weight:bold; }



/** 各單元共用內容 */

ul[class^="list"], ul[class*=" list"], .inquiry-list ul, .inquiry-list li,

.main-nav ul, .main-nav li, .cycle-wrap ul, .cycle-wrap li,

.products-category ul, .products-category li, .products-list ul, .products-list li,

.desc-list, .desc-list li, .sub-link ul, .sub-link li, .tab-item > ul, .tab-item > ul > li,

.cycle-products ul, .cycle-products li, .page-limit ul, .page-limit li, .dealers ul, .dealers li,

.info-nav ul, .info-nav li, .sample-figure ul, .sample-figure li, .footer-nav ul, .footer-nav li,

.comm-info ul, .comm-info li, .form-wrap ul, .form-wrap li, .news-list ul, .news-list li,

.language ul, .language li, .chose-form ul, .chose-form li, .contact ul, .contact li {

    margin:0;padding:0;list-style:none outside none;

}



a { color: inherit; text-decoration:none; outline:none; }

a:hover { text-decoration: underline; }

.red-text {

	color:#EC0000;

	display:inline-block;

	vertical-align:middle;

	line-height:14px;

	margin:0 5px;

}

img { border:0; vertical-align:middle; max-width:100%; margin:0 auto; overflow:hidden; }

label,

input[type="checkbox"],

input[type="radio"],

input[type="submit"],

input[type="reset"],

input[type="button"],

button {

	vertical-align:middle;

    cursor:pointer;

}

.table-wrap table {

	table-layout:fixed;

	border-collapse:collapse;

}

.wrap { position:relative; box-sizing:border-box; width:1000px; margin:0 auto; }

article p { margin:10px 0; }

.info-wrap:after, .clear:after, .editor:after, sample-wrap:after {

	content: ".";

	display: block;

	height: 0;

	clear: both;

	visibility: hidden;

}

#container { 

	position:relative;

	min-width:1024px;

	box-sizing:border-box;

	margin:0 auto;

	text-align:left;

	overflow:hidden;

}

.info-wrap { min-width:1000px; max-width:1200px; margin:0 auto; box-sizing:border-box; overflow:visible; }

#header {

	position:relative; text-align:right;

	height:120px; padding:0;

	box-sizing:border-box;

	z-index:9;

}

#logo { position:absolute; left:0; top:40px; }

#logo a, #logo img { display:block; }

.main-nav { position:relative; padding:70px 0 0; z-index:0; display:inline-block; }

.main-nav ul { font-size:0; }

.main-nav li {

	position:relative;

	display:inline-block;

	vertical-align:top;

	text-align:left;

	font-size:14px;

	margin:0 45px 0 0;

	transition: all .6s;

	-moz-transition: all .6s;

	-webkit-transition: all .6s;

	-ms-transition: all .6s;

	-o-webkit-transition: all .6s;

	box-sizing:border-box;

}

.main-nav > ul > li:before, .main-nav li ul:before {

	content:'';

	position:absolute; left:0; top:0; width:1px; height:100%;

	box-sizing:border-box; overflow:hidden; background:#fff;

}

.main-nav li a { text-decoration:none; display:block; color:#fff; padding:20px 5px 0; line-height:1; }

.main-nav li ul {

	position:absolute;

	padding:10px 0 0;

	box-sizing:border-box;

	display:none;

}

.main-nav li.on > a, .main-nav li:hover > a, .main-nav li.click > a {

	color:#f00;

	transition: all .6s;

	-moz-transition: all .6s;

	-webkit-transition: all .6s;

	-ms-transition: all .6s;

	-o-webkit-transition: all .6s;

}

.main-nav li li { display:block; margin: 5px 0 0; }

.main-nav li li a { padding:0 5px; white-space:nowrap; line-height:1.2; display:block; }

.main-nav li.click ul { display:block; }

.main-nav [class^="icon-"] { border:0 none; margin:0; }

.main-nav [class^="icon-"]:before { content:none; }

.main-nav [class^="icon-"] a { padding:0; text-indent:-9999px; }

.main-nav .icon-facebook a { width:20px; height:20px; background:url(../images/icon-facebook.png) center no-repeat; }

.main-nav .icon-mail { margin-left:20px; }

.main-nav .icon-mail a { width:28px; height:20px; background:url(../images/icon-mail.png) center no-repeat; }

#content { position:relative; left:50%; margin-left:-600px; width:1200px; padding:110px 0 130px; box-sizing:border-box; text-align:center; }

#content:after { content:''; width:100%; height:50px; background:url(../images/bg-shadow.png) center top no-repeat; position:absolute; bottom:0; left:0; }

.info-detail h1, .info-detail h2 { line-height:1; text-align:left; box-sizing:border-box; }

.info-detail h1 { font-size:50px; }

.info-detail h2 { font-size:18px; margin-bottom:50px; }

.info-detail h2 span { color:#ddd; font-size:20px; margin:10px 0; display:block; }

.info-wrap h3 { font-size:16px; line-height:1; }

.info-wrap .header { position:relative; padding:15px 0; }

.info-wrap .header:after {

	content:'';

	position:absolute;	bottom:0; left:0; width:100%; border-bottom:1px solid #8c0000;

	border-top:1px solid #d90000;

}

.info-wrap .info-detail { position:relative; text-align:left; }

.info-wrap .abs-figure { position:absolute; z-index:9; }

#footer {

	position:relative;

	font-size:12px;

	box-sizing:border-box;

	padding:20px 0;

	height:200px;

	background:url(../images/bg-footer.png);

	overflow:hidden;

}

#footer .wrap { overflow:hidden; text-align:right; }

#footer .addr { float:left; margin:0 0 10px; padding-left:20px; text-align:left; overflow:hidden; background:url(../images/icon-pre01.png) left 2px no-repeat; }

#footer .addr a:hover { color:#f00; }

#footer .addr address { color:#bbb; }

#footer .copyright { position:relative; text-align:left; border-top:1px solid #626262; margin-top:10px; padding:10px; }

#footer .design { position:absolute; right:10px; top:10px; color:#777;}

#footer .design a { color:#fff;}

#footer .footer-nav { font-size:0; }

#footer .footer-nav li {

    font-weight:bold;

	text-align:left;

    margin:0px auto 5px; display:block;
}

#footer .footer-nav > ul > li {

    padding-left:20px;

	background:url(../images/icon-pre01.png) left 2px no-repeat;

    display:inline-block; vertical-align:top; margin:0 25px 0 155px; font-size:13px; text-align:left;

}

#footer .footer-nav li a:hover { color:#777; text-decoration:none; }

#footer .footer-nav li li {

    position:relative;

    font-size:12px; font-weight:normal; display:block;

	line-height:1.2;margin:5px 0;

	color:#bababa;

}

#footer .footer-nav li a:hover { color:#f00; }

#backstretch { display:none; position:fixed; width:100%; height:100%; left:0; top:0; z-index:-1; }

.info-title { margin:0 0 15px; color:#111; font-size:21px; }

.cycle-nav { text-align:center; position:absolute; left:0; bottom:0px; z-index:111; width:100%; }

.cycle-nav span {

	cursor:pointer; display:inline-block; vertical-align:top;

	text-align:left; text-indent:-9999px; margin:0 5px;

	-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;

	background:#878787; width:7px; height:7px;

}

.cycle-nav span.on { background:#cd0d21; }

.back-btn {

	display:block;

	box-sizing:border-box;

	width:115px;

	height:25px;

	line-height:25px;

	text-align:center;

	color:#fff;

	background:#ffa332;

	border:1px solid #e17c00;

	text-decoration:none;

	font-weight:bold;

}

.back-btn:before { margin-right:5px; }

.back-btn:hover { background:#e17c00; text-decoration:none; }

.top-btn { text-align:right; margin:20px 0 0; }

a.gotop-btn {

	display:inline-block; text-align:left; text-decoration:none; color:#fff; font-weight:bold; width:90px; box-sizing:border-box;

	padding:5px 0 5px 40px; background: #000;

}

.gotop-btn:hover { background:#cd0d21; }

/** 表單 */

.form-wrap { text-align:left; padding:0 2px; font-size:13px; }

.form-wrap li { position:relative; margin:10px 0; overflow:hidden; }

.form-wrap li.caption { font-size:12px; color:#000; padding:0 0 5px; text-align:left; }

.form-wrap li.caption .red-text { position:static; }

.form-wrap li.topic { background:none; }

.form-wrap li > div { position:relative; display:block; vertical-align:top; border:0 none; padding:5px; }

.form-wrap li .red-text { position:absolute; right:0px; margin:5px; }

.form-wrap li > div:first-child { pointer-events:none; box-sizing:border-box; position:absolute; left:5px; top:5px; }

.form-wrap li input[type="text"],

.form-wrap li input[type="email"] {

	color:#fff; background:url(../images/bg-input.png); box-sizing:border-box; width:100%;

	height:26px; line-height:26px; padding-right:15px; border:0 none;

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}

.form-wrap li select { width:100%; padding:4px; }

.form-wrap li textarea {

	background:url(../images/bg-input.png); border:0 none; color:#fff; display:block; box-sizing:border-box; width:100%; height:152px; padding:5px; margin:0 0 10px;

	resize:vertical;

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}

.form-wrap .captcha input[type="text"] { vertical-align:middle; margin-right:10px; width:150px; margin:0 0 10px; }

.form-wrap .captcha a { margin-left:60px; font-size:12px; color:#000; display:inline-block; vertical-align:middle; text-decoration:underline; }

.form-wrap .captcha img { float:right; display:block; }

.form-wrap .submit-wrap { margin:30px 0; text-align:right; }

.form-wrap input[type="submit"], .form-wrap input[type="reset"] {

	font-weight:bold; line-height:50px;text-align:center;

	width:110px; display:inline-block; vertical-align:top;

	margin:10px 0; border:0 none;

	background:#E7B3B3;

	color:#000;

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}

.form-wrap input[type="reset"] { background:#580000; color:#fff; margin-left:20px; }

.form-wrap input[type="reset"]:hover { background:#000; } 

.form-wrap input[type="submit"]:hover { background:#fff; }

.form-wrap .topic .chkbox-wrap {

	margin:5px 10px; display:inline-block; vertical-align:top;

	position:relative; overflow:hidden; }

.form-wrap .topic .chkbox-wrap span { display:inline-block; padding-left:20px; background:url(../images/icon-checked.png) left center no-repeat; }

.form-wrap .topic .chkbox-wrap input { position:absolute; left:-50px; top:0; }

.form-wrap .topic .chkbox-wrap.on span{ background:url(../images/icon-checked-on.png) left center no-repeat; }

/** home */

.comm-info { position:relative; }

.comm-info h1, .comm-info h2 { padding:0 5px; width:500px; }

.comm-info .arrow { display:block; width:21px; height:41px; position:absolute; top:70px; overflow:hidden; }

.comm-info .prev { background:url(../images/icon-arr01.png) left center no-repeat; left:-50px; }

.comm-info .next { background:url(../images/icon-arr01.png) right center no-repeat; right:-50px; }

.comm-info { width:1000px; margin:0 auto; text-align:center; font-size:0; }

.comm-about, .comm-service {

	position:relative;

	text-align:left;

	background:url(../images/bg-comm01.png);

	display:inline-block;

	vertical-align:top;

	width:490px;height:220px;

	box-sizing:border-box;

	padding:10px;

	overflow:hidden;

}

.comm-about { margin-right:20px; }

.comm-about figure, .comm-service figure { margin:0 10px 0 0; float:left; }

.comm-about .text, .comm-service .text { margin:0 10px 0 230px; font-size:13px; }



.comm-about a, .comm-service a {

	font-size:12px; position:absolute; bottom:15px; right:20px; border:1px solid #fff; text-decoration:none;

	width:55px; height:20px; line-height:20px; box-sizing:border-box; text-align:center; letter-spacing:1px;

}

/** about */

.about h1, .about h2 { padding:0 50px 0 150px; }

.about .editor { box-sizing:border-box; height:390px; padding:45px 645px 45px 100px; background:url(../images/bg-about01.png); }

.about .abs-figure { top:60px; right:40px; }

/** products */

.products h1, .products h2 { padding:0 50px 0 150px; }

.products .editor { box-sizing:border-box; padding:10px 700px 25px 150px;  height:450px; background:url(../images/bg-products01.png); }

.products dl, .products dt, .products dd { display:block; margin:0; padding:0; font-family: 'MyriadPro-Regular'; }

.products dt { font-size:18px; line-height:1; margin:15px 0 5px; }

.products dd { font-size:14px; color:#ddd; margin-bottom:10px;}

.products .pro-1 .abs-figure { right:100px; top:70px; }



.products .pro-2 .editor { height:390px; font-size:14px; font-family: 'MyriadPro-Regular'; }

.products .pro-2 .header { padding:20px 0 40px; margin-bottom:30px; }

.products .pro-2 h3 { margin:0 0 10px; font-size:20px; font-weight:normal; line-height:1; }

.products .pro-2 .abs-figure { right:125px; top:90px; }



.products .pro-3 { padding-bottom:100px; }

.products .pro-3 .editor { position:relative; height:250px; padding:10px 40px 25px 150px; }

.products .pro-3 .editor figure { position:absolute; right:100px; top:-50px; }

.products .pro-3 .abs-figure { left:150px; bottom:30px; }

.products .pro-3 .header:after { content: none; }



.products .pro-4 { padding-bottom:90px; }

.products .pro-4 .editor { position:relative; height:250px; padding:40px 40px 25px 150px; }

.products .pro-4 .abs-figure { right:100px; bottom:-50px; }

.products .pro-4 .header:after { content:none; }



.products .pro-5 { padding-bottom:90px; }

.products .pro-5 h2 { margin-bottom:80px; }

.products .pro-5 h3 { font-size:14px; color:#ddd; line-height:2; }

.products .pro-5 .editor { position:relative; height:250px; padding:70px 40px 25px 150px; }

.products .pro-5 .abs-figure { right:100px; bottom:35px; }

.products .pro-5 .header { width:380px; }

.products .pro-5 .header:after { content:none; }



/** contact */

.contact h1, .contact h2 { padding:0 50px 0 150px; clear:both; }

.contact .wrap { box-sizing:border-box; padding:0 50px; }

.contact .address { float:left; box-sizing:border-box; width:300px; overflow:hidden; }

.contact .header { width:300px; display:block; margin-bottom:50px; padding:0 0 20px 0px; }

.contact dl, .contact dt, .contact dd { margin:0; padding:0; overflow:hidden; }

.contact dt { float:left; text-align:right; width:90px; }

.contact dd { float:left; box-sizing:border-box; padding:0 0 0 5px; width:210px; }

.contact .google-map { width:300px; height:280px; margin:30px auto 0; overflow:hidden; }

.contact .address a { color:#ec1b23; text-decoration:underline; }

.contact .form-wrap { margin-left:420px; box-sizing:border-box; padding:30px 60px; background:url(../images/bg-form.png); overflow:hidden; }

.contact .map-wrap .g-map { width:570px; height:365px; box-sizing:border-box; border:1px solid #444; overflow:hidden; margin:20px 0; }

.contact .caption {  text-align:right; }

.contact .captcha img { width:185px; }

@font-face {

	font-family: 'MyriadPro-Regular';

	src: url('font/myriad/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'), 

	     url('font/myriad/MyriadPro-Regular.woff') format('woff'), 

	     url('font/myriad/MyriadPro-Regular.ttf')  format('truetype'),

	     url('font/myriad/MyriadPro-Regular.svg#MyriadPro-Regular') format('svg');

}