html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
fieldset,
form,
label,
legend,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline
}

dl,
dt,
dd,
ol,
ul,
li {
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline
}

table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block
}

body {
	line-height: 1
}

blockquote,
q {
	quotes: none
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: '';
	content: none
}

td {
	vertical-align: middle
}

td img {
	max-width: none
}

.cell img {
	max-width: none
}

a {
	color: inherit
}

img {
	max-width: 100%;
	vertical-align: middle
}

button,
label,
input[type="submit"],
input[type="reset"],
input[type="radio"],
input[type="checkbox"] {
	cursor: pointer
}

.clear:after,
#header .inner-wrap:after,
.editor:after,
#home .comm-service ul:after,
#home .comm-products .inner-wrap:after,
#company .inner-wrap:after,
#service .inner-wrap:after,
#products .inner-wrap:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden
}

.noSelect {
	user-select: none;
	-o-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none
}

html {
	font-size: 62.5%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

*,
*:before,
*:after {
	box-sizing: inherit
}

body {
	font-size: 15px;
	font-size: 1.5rem;
	font-family: Arial, Helvetica, Helvetica Neue, Tahoma, Verdana, "微軟正黑體", 'Microsoft JhengHei', 'MHei', 'STHeitiTC-Light', 'sans-serif';
	color: #333;
	line-height: 1.5;
	background: #fff;  /* 666 */
	text-align: center
}

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

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="reset"],
input[type="submit"] {
	font-size: 16px;
	font-size: 1.6rem;
	padding: 7px 5px
}

input[type="checkbox"],
input[type="radio"],
input[type="submit"],
input[type="reset"],
input[type="button"] {
	vertical-align: middle;
	cursor: pointer
}

select {
	font-size: 16px;
	font-size: 1.6rem;
	padding: 7px 5px;
	cursor: pointer;
	vertical-align: middle
}

.page-limit .prev,
#news .news-detail .btn-back,
#news .news-detail .article-chose .btn-prev {
	color: #525252;
	display: inline-block;
	vertical-align: middle;
	padding: 0 0 0 15px;
	background: url(../images/arr-prev1.png) left center no-repeat
}

.page-limit .prev:hover,
#news .news-detail .btn-back:hover,
#news .news-detail .article-chose .btn-prev:hover {
	color: #000;
	background: url(../images/arr-prev1.png) left center no-repeat
}

.page-limit .next,
#news .news-detail .article-chose .btn-next {
	color: #525252;
	display: inline-block;
	vertical-align: middle;
	padding: 0 15px 0 0;
	background: url(../images/arr-next1.png) right center no-repeat
}

.page-limit .next:hover,
#news .news-detail .article-chose .btn-next:hover {
	color: #000;
	background: url(../images/arr-next1.png) right center no-repeat
}

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

a:hover {
	text-decoration: underline
}

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

.slick-wrap {
	position: relative
}

.slick-wrap button {
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: center;
	outline: none;
	background: none;
	border: none;
	display: block;
	color: #fff
}

.lang-wrap {
	font-size: 14px;
	font-size: 1.4rem;
	position: relative;
	color: #bbb;
	display: inline-block;
	vertical-align: middle;
	margin: 0 0 0 15px;
	padding: 0 15px;
	background: url(../images/icon-lang.html) left no-repeat
}

.lang-wrap a {
	display: block;
	text-decoration: none;
	padding: 10px
}

.lang-wrap .sub-node {
	display: none;
	position: absolute;
	right: 0;
	width: 100%
}

.lang-wrap ul {
	margin: 0;
	padding: 5px 0;
	list-style: none outside none;
	background: url(../images/header-bg.html)
}

.lang-wrap ul li {
	margin: 0;
	text-align: center
}

.lang-wrap ul li a {
	display: block;
	padding: 10px
}

.lang-wrap ul li:hover,
.lang-wrap ul li.on {
	color: #fff
}

.lang-wrap:after {
	content: '';
	display: block;
	position: absolute;
	top: 20px;
	right: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 4px 0 4px;
	border-color: #bbb transparent transparent transparent
}

.title,
#case .item-group h3 {
	font-size: 20px;
	font-size: 2rem;
	margin: 0 auto 20px
}

.title span,
#case .item-group h3 span,
.title strong,
#case .item-group h3 strong {
	display: inline-block;
	vertical-align: middle
}

.title span:first-child,
#case .item-group h3 span:first-child,
.title strong:first-child,
#case .item-group h3 strong:first-child {
	margin: 0 5px 0 0
}

.title strong,
#case .item-group h3 strong {
	color: #00479d
}

#container {
	position: relative;
	margin: 0 auto;
	overflow: hidden;
	background: #fff;
	text-align: left;
	min-width: 320px
}

#header {
	position: relative;
	z-index: 9999;
	background: #fff
}

#header ul,
#header li {
	margin: 0;
	padding: 0;
	list-style: none outside none
}

#header .inner-wrap {
	position: relative;
	max-width: 1280px;
	margin: 0 auto;
	z-index: 1
}

#header .facebook {
	position: absolute;
	top: 25px;
	right: 0;
	width: 38px;
	height: 38px;
	font-size: 0;
	background: url(../images/icon-fb.jpg) right center no-repeat
}

#header .facebook a {
	display: block;
	line-height: 38px
}

#header .facebook:hover {
	opacity: .5;
	transition: .5s
}

#logo {
	position: absolute;
	left: 20px;
	top: 20px;
	display: inline-block;
	vertical-align: top;
	max-width: 50%
}

#logo img {
	display: block
}

#nav-btn {
	position: absolute;
	font-size: 0;
	right: 20px;
	top: 50%;
	text-indent: -9999px;
	display: none;
	margin: -17px 0 0;
	width: 34px;
	height: 34px;
	background: #f7b400;
	overflow: hidden;
	z-index: 2
}

#nav-btn .thumb {
	width: 18px;
	height: 2px;
	background: #fff;
	display: block;
	position: absolute;
	left: 50%;
	margin: 0 0 0 -9px;
	-moz-transform-origin: center;
	-ms-transform-origin: center;
	-o-transform-origin: center;
	-webkit-transform-origin: center;
	transform-origin: center
}

#nav-btn .thumb.thumb-1,
#nav-btn .thumb.thumb-2,
#nav-btn .thumb.thumb-3 {
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	-ms-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out
}

#nav-btn .thumb.thumb-1 {
	top: 10px
}

#nav-btn .thumb.thumb-2 {
	top: 50%;
	margin-top: -1px
}

#nav-btn .thumb.thumb-3 {
	bottom: 10px
}

#nav-btn.on .thumb-1 {
	top: 50%;
	margin-top: -1px;
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg)
}

#nav-btn.on .thumb-2 {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0
}

#nav-btn.on .thumb-3 {
	top: 50%;
	margin-top: -1px;
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg)
}

#main-nav {
	position: relative;
	font-size: 0;
	float: right;
	margin: 0 6% 0 0;
	-moz-transition: left .5s;
	-o-transition: left .5s;
	-webkit-transition: left .5s;
	transition: left .5s
}

#main-nav ul {
	position: relative;
	max-width: 1280px;
	margin: 0 auto;
	z-index: 1
}

#main-nav li {
	color: #666
}

#main-nav li a {
	position: relative;
	text-decoration: none;
	display: block
}

#main-nav .has-nav>a {
	background: url(../images/icon-arr03.png) right center no-repeat
}

#main-nav>ul>li {
	font-size: 15px;
	font-size: 1.5rem;
	margin: 0 10px;
	display: inline-block;
	vertical-align: middle
}

#main-nav>ul>li>a {
	position: relative;
	display: block;
	vertical-align: top;
	font-weight: bold;
	padding: 33px 15px 33px;
	background: #fff
}

#main-nav>ul>li>a:after {
	position: absolute;
	display: block;
	width: 100%;
	height: 3px;
	left: 0;
	bottom: 0;
	background: #f7b400
}

#main-nav>ul>li:hover,
#main-nav>ul>li.on {
	color: #333
}

#main-nav .last>a {
	text-align: center;
	background: #f7b400;
	color: #fff;
	padding: 8px 15px
}

#main-nav .last>a:after {
	height: 0;
	overflow: hidden
}

#main-nav .sub-nav {
	font-size: 0;
	display: none;
	position: absolute;
	right: 0;
	white-space: nowrap
}

#main-nav .sub-nav>ul {
	margin: 0 auto;
	padding: 0 20px;
	text-align: left
}

#main-nav .sub-nav>ul>li {
	font-size: 14px;
	font-size: 1.4rem;
	color: #ccc;
	display: inline-block;
	vertical-align: top;
	margin: 0 20px;
	background: url(../images/icon-arr01.png) left center no-repeat
}

#main-nav .sub-nav>ul>li>a {
	position: relative;
	padding: 10px 0 10px 10px
}

#main-nav .sub-nav>ul>li:hover,
#main-nav .sub-nav>ul>li.on {
	color: #fff;
	background: url(../images/icon-arr01-on.png) left center no-repeat
}

.sub-nav-bg {
	position: absolute;
	width: 100%;
	left: 0;
	z-index: 0;
	display: none;
	background: #000
}

.sub-nav-bg.on {
	display: block
}

#banner {
	overflow: hidden
}

#banner ul,
#banner li {
	margin: 0;
	padding: 0;
	list-style: none outside none
}

#banner .bg {
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%
}

#banner .bg>img {
	display: block;
	visibility: hidden
}

#banner .item {
	font-size: 14px;
	font-size: 1.4rem;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	position: relative;
	text-align: center;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-o-transition: all .3s;
	-ms-transition: all .3s;
	transition: all .3s;
	min-height: 320px
}

#banner .item .bg {
	position: relative;
	left: auto;
	top: auto;
	width: auto;
	height: auto
}

#banner .item .text {
	position: absolute;
	line-height: 1.2;
	z-index: 1;
	max-width: 1280px;
	top: 30%;
	right: 10%
}

#banner .item .text:after {
	content: '';
	display: block;
	width: 53px;
	height: 24px;
	background: url(../images/icon-arr05.png) center no-repeat;
	margin: 30px auto 0
}

#banner .item h1,
#banner .item h2,
#banner .item p {
	margin: 0 auto 20px
}

#banner .item h1 {
	font-size: 48px;
	font-size: 4.8rem;
	font-weight: normal
}

#banner .item h2 {
	font-size: 37px;
	font-size: 3.7rem
}

#banner .item p {
	margin: 20px auto
}

#banner .item .more {
	display: block;
	padding: 5px;
	width: 160px;
	max-width: 90%;
	margin: 0 auto;
	border: 1px solid #000
}

#banner .item a {
	display: block;
	height: 100%;
	text-decoration: none
}

#banner .item.slick-active {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1
}

#banner .slick-prev,
#banner .slick-next {
	font-size: 0;
	text-indent: -9999px;
	position: absolute;
	top: 0;
	width: 30px;
	height: 100%;
	border: 0 none
}

#banner .slick-dots {
	position: absolute;
	bottom: 40px;
	left: 20px;
	text-align: center;
	width: 100%
}

#banner .slick-dots .slick-active {
	background: #f7b400
}

#banner .slick-dots .slick-active button {
	color: #fff
}

#banner .slick-dots li {
	border-radius: 50%;
	display: inline-block;
	vertical-align: top;
	color: #f7b400;
	margin: 10px 5px 0;
	border: 1px solid #f7b400;
	background: #fff
}

#banner .slick-dots li button {
	width: 12px;
	height: 12px;
	border: 0 none;
	color: #f7b400;
	opacity: 0
}

#banner[data-info] {
	font-size: 17px;
	font-size: 1.7rem;
	height: 340px;
	padding: 0 20px;
	color: #333;
	text-align: center
}

#banner[data-info] .title,
#banner[data-info] #case .item-group h3,
#case .item-group #banner[data-info] h3 {
	font-size: 47px;
	font-size: 4.7rem;
	margin: 110px auto 0;
	position: relative;
	font-weight: normal;
	color: #111
}

#banner[data-info] a {
	display: inline-block;
	margin: 10px auto 0
}

#banner[data-info] .text {
	position: relative;
	z-index: 1
}

#banner[data-info] p {
	text-shadow: 0 0 1px #aaa
}

#banner[data-info=products] {
	height: 400px
}

#footer {
	font-size: 15px;
	font-size: 1.5rem;
	position: relative;
	min-height: 200px;
	padding: 30px 0;
	border-top: 4px solid #f7b400
}

#footer a {
	text-decoration: none
}

#footer ul,
#footer li {
	margin: 0 auto;
	padding: 0;
	list-style: none
}

#footer .inner-wrap {
	position: relative;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0;
	overflow: hidden
}

#footer .footer-nav {
	font-size: 14px;
	font-size: 1.4rem;
	float: right;
	text-align: center;
	font-weight: bold;
	color: #594539
}

#footer .footer-nav a {
	display: block;
	margin: 0 auto 15px
}

#footer .footer-nav li {
	display: inline-block;
	vertical-align: top;
	width: 120px;
	margin: 0 auto 20px;
	padding: 0 20px 0 0
}

#footer .footer-nav .sub-nav {
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: normal;
	color: #666
}

#footer .footer-nav .sub-nav a {
	margin: 0 auto 10px
}

#footer .footer-logo {
	position: absolute;
	left: 20px;
	top: 0
}

#footer .footer-logo-app1 {
	position: absolute;
	left: 20px;
	top: 60px
}

#footer .footer-logo-app2 {
	position: absolute;
	left: 140px;
	top: 60px
}

#footer .addr,
#footer .copyright {
	margin: 0 0 0 0px  /* margin: 0 0 0 220px */
}

#footer .addr {
	font-size: 12px;
	font-size: 1.2rem;
	display: inline-block;
	vertical-align: top;
	padding: 0 0 10px;
	text-align: left;  /* add by michael 2019-3-14 */
	margin: 0 0 0 0px;
}

#footer .addr h3 {
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1;
	margin: 0 auto 10px;
	font-weight: normal
}

#footer .addr li {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin: 0 40px 10px 0;
	padding: 0 0 0 25px
}

#footer .addr li:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 20px;
	height: 20px
}

#footer .addr .icon-location {
	display: block;
	margin: 0 0 5px 0
}

#footer .addr .icon-location:before {
	background: url(../images/icon-location.png) center no-repeat
}

#footer .addr .icon-tel:before {
	background: url(../images/icon-tel.png) center no-repeat
}

#footer .addr .icon-fax:before {
	background: url(../images/icon-fax.png) center no-repeat
}

#footer .addr .icon-mail {
	margin: 0 0 10px 0;
	text-decoration: underline
}

#footer .addr .icon-mail:before {
	background: url(../images/icon-mail.png) center no-repeat
}

#footer .addr .contact-info h3 {
	margin: 20px 0 10px;
	font-size: 15px;
	font-size: 1.5rem
}

#footer .addr .contact-info strong {
	font-weight: normal;
	text-shadow: .5px 0 0 #000;
	color: #000
}

#footer .addr .contact-info .icon-sky {
	padding: 0 0 0 4%
}

#footer .addr .contact-info .icon-sky:before {
	display: none
}

#footer .addr .contact-info .icon-sky img {
	margin: 0 !important;
	vertical-align: middle !important
}

#footer .copyright {
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: normal;
	color: #555
}

#footer .copyright p {
	display: inline-block;
	vertical-align: top;
	margin: 0 5px 5px 0
}

#footer .copyright a {
	text-decoration: underline
}

#mask-bg {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 0;
	background: #000;
	overflow: hidden;
	z-index: 999;
	-moz-transition: opacity .3s;
	-o-transition: opacity .3s;
	-webkit-transition: opacity .3s;
	transition: opacity .3s
}

.go-top {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	border-radius: 50%;
	background: #f7b400;
	position: fixed;
	bottom: 50px;
	right: 50px;
	text-align: center;
	color: #fff;
	border: 1px solid #fff;
	font-weight: bold;
	text-decoration: none;
	width: 0;
	height: 0;
	overflow: hidden;
	z-index: 11;
	-moz-transition: opacity .5s;
	-o-transition: opacity .5s;
	-webkit-transition: opacity .5s;
	transition: opacity .5s
}

.go-top.block {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1;
	width: 45px;
	height: 45px;
	line-height: 45px
}

.go-top.end {
	position: absolute;
	top: -75px
}

.go-top:hover {
	text-decoration: none
}

.inline div,
.inline dl,
.inline ul {
	display: inline-block;
	vertical-align: top
}

.chk {
	position: relative;
	width: 20px;
	height: 20px;
	display: block;
	border: 1px solid #000;
	z-index: 2
}

.chk input {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0
}

.chk.on {
	background: url(../images/icon-chk.html) center no-repeat
}

.btn-download,
.btn-query {
	font-size: 15px;
	font-size: 1.5rem;
	position: relative;
	color: #fff;
	background: #000;
	border: 0 none;
	text-decoration: none;
	margin: 10px auto;
	height: 40px;
	line-height: 40px;
	padding: 0 15px;
	display: inline-block;
	vertical-align: top;
	-moz-transition: all .5s;
	-o-transition: all .5s;
	-webkit-transition: all .5s;
	transition: all .5s
}

.btn-download:hover,
.btn-query:hover {
	background: #e50011;
	text-decoration: none
}

.btn-download:before,
.btn-query:before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	margin: 0 5px 0 0
}

.btn-download:before {
	width: 30px;
	height: 20px;
	background: url(../images/icon-download.html) center no-repeat
}

.btn-query:before {
	width: 15px;
	height: 20px;
	background: url(../images/icon-inquiry.html) center no-repeat
}

.tab-head {
	position: relative;
	font-size: 0
}

.tab-head ul,
.tab-head li {
	margin: 0;
	padding: 0;
	list-style: none outside none
}

.tab-head ul {
	position: relative;
	z-index: 1
}

.tab-head li {
	font-size: 16px;
	font-size: 1.6rem;
	margin: 0 0 0 2px;
	display: inline-block;
	vertical-align: top;
	color: #464646;
	background: #c8c8c8
}

.tab-head li:first-child {
	margin: 0
}

.tab-head li.on,
.tab-head li:hover {
	color: #fff;
	background: #00479d
}

.tab-head a {
	display: block;
	text-decoration: none;
	padding: 10px 20px
}

.tab-head:after {
	content: '';
	display: block;
	width: 100%;
	height: 2px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: #c8c8c8
}

.tab-detail {
	padding: 20px 0
}

.tab-detail .item {
	display: none
}

.tab-detail .item.on {
	display: block
}

.table-wrap table {
	width: 100%;
	border-collapse: collapse
}

.web-figure,
.mobile-figure {
	margin: 0 auto 20px;
	display: none
}

.service {
	font-size: 15px;
	font-size: 1.5rem;
	margin: 50px auto 0;
	padding: 50px 20px
}

.service .tab-head li {
	background: #fff;
	border: 1px solid #dbdbdb;
	color: #d6d6d6
}

.service .tab-head li:hover,
.service .tab-head li.on {
	background: #e50011;
	border: 1px solid #e50011;
	color: #fff
}

.service .tab-head a {
	padding: 5px 20px 3px
}

.service .tab-head:after {
	height: 3px;
	background: #e50011;
	z-index: 2
}

.service .tab-detail {
	padding: 0
}

.service .table-wrap th,
.service .table-wrap td {
	padding: 10px;
	background: #fff
}

.service .table-wrap th:first-child,
.service .table-wrap td:first-child {
	text-align: center
}

.service .table-wrap th {
	background: #dbdbdb;
	white-space: nowrap
}

.service .table-wrap .odd td {
	background: #ededed
}

.contact-form {
	font-size: 16px;
	font-size: 1.6rem;
	position: relative;
	font-weight: bold
}

.contact-form .note {
	font-size: 15px;
	font-size: 1.5rem;
	color: #555;
	margin: 0 auto 20px
}

.contact-form .inline-block {
	overflow: hidden
}

.contact-form ul,
.contact-form li {
	margin: 0 auto;
	padding: 0;
	list-style: none outside none
}

.contact-form ul {
	float: left;
	width: 45%
}

.contact-form ul:first-child {
	margin: 0 10% 0 0
}

.contact-form li {
	display: table;
	width: 100%
}

.contact-form li>div {
	display: table-cell;
	vertical-align: top;
	padding: 10px 0
}

.contact-form li>div i {
	font-size: 14px;
	font-size: 1.4rem;
	color: #e50011;
	margin: 0 5px;
	font-family: Verdana
}

.contact-form li>div:first-child {
	width: 120px
}

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="url"] {
	width: 100%;
	margin: 0;
	padding: 5px
}

.contact-form textarea {
	width: 100%;
	height: 100px;
	margin: 0;
	padding: 5px
}

.contact-form select {
	width: 100%;
	margin: 0;
	padding: 5px
}

.contact-form .sec-code .clear,
.contact-form .sec-code #header .inner-wrap,
#header .contact-form .sec-code .inner-wrap,
.contact-form .sec-code .editor,
.contact-form .sec-code #home .comm-service ul,
#home .comm-service .contact-form .sec-code ul,
.contact-form .sec-code #home .comm-products .inner-wrap,
#home .comm-products .contact-form .sec-code .inner-wrap,
.contact-form .sec-code #company .inner-wrap,
#company .contact-form .sec-code .inner-wrap,
.contact-form .sec-code #service .inner-wrap,
#service .contact-form .sec-code .inner-wrap,
.contact-form .sec-code #products .inner-wrap,
#products .contact-form .sec-code .inner-wrap {
	width: 100%
}

.contact-form .sec-code img {
	float: left
}

.contact-form .sec-code input[type="text"] {
	width: 170px;
	max-width: 50%;
	float: right
}

.contact-form .sec-code .btn-wrap {
	margin: 20px auto 0;
	text-align: right
}

.contact-form .sec-code .btn-submit {
	display: inline-block;
	vertical-align: middle;
	background: #03b2c3;
	color: #fff;
	border: 0 none;
	width: 160px
}

.page-limit {
	text-align: center;
	margin: 50px auto 0
}

.page-limit ul {
	display: inline-block;
	margin: 0;
	padding: 0;
	list-style: none outside none;
	color: #525252;
	font-size: 0
}

.page-limit ul li {
	font-size: 15px;
	font-size: 1.5rem;
	position: relative;
	display: inline-block;
	vertical-align: top;
	min-width: 36px;
	height: 36px;
	text-align: center;
	line-height: 36px
}

.page-limit ul li:hover,
.page-limit ul li.on {
	background-color: #4fbbce;
	color: #fff
}

.page-limit ul li:before {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	content: '';
	display: block;
	border: 1px solid #e8e8e8;
	border-left: 0
}

.page-limit ul li:first-child:before {
	border-left: 1px solid #e8e8e8
}

.page-limit ul li.prev:before {
	border: 0 none;
	border-right: 1px solid #e8e8e8
}

.page-limit ul li.next:before {
	border: 0 none
}

.page-limit ul li.dot:hover {
	background: none;
	color: #bfbfbf
}

.page-limit ul li.dot:before {
	border: 0 none;
	border-right: 1px solid #e8e8e8
}

.page-limit a {
	position: relative;
	display: block;
	z-index: 1;
	text-decoration: none
}

.page-limit .prev,
.page-limit .next {
	border: 0 none
}

.page-limit .prev:hover,
.page-limit .next:hover {
	color: #000
}

.page-limit .prev a {
	margin: 0 10px 0 0
}

.page-limit .next a {
	margin: 0 0 0 10px
}

#home .comm-products .more,
#home .comm-news .more {
	font-size: 14px;
	font-size: 1.4rem;
	border-radius: 3px;
	width: 120px;
	padding: 5px 0;
	text-align: center;
	color: #535353;
	font-weight: bold;
	display: block;
	text-decoration: none;
	background: #fff;
	background: -moz-linear-gradient(top, #fff 0%, #d8d8d8 100%);
	background: -webkit-linear-gradient(top, #fff 0%, #d8d8d8 100%);
	background: linear-gradient(to bottom, #fff 0%, #d8d8d8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#d8d8d8', GradientType=0)
}

#home .comm-products .more:hover,
#home .comm-news .more:hover {
	color: #fff;
	background: #555;
	background: -moz-linear-gradient(top, #555 0%, #222 100%);
	background: -webkit-linear-gradient(top, #555 0%, #222 100%);
	background: linear-gradient(to bottom, #555 0%, #222 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#222222', GradientType=0)
}

.editor {
	position: relative;
	overflow: hidden
}

#home ul,
#home li {
	margin: 0 auto;
	padding: 0;
	list-style: none
}

#home .inner-wrap {
	max-width: 1280px;
	margin: 0 auto
}

#home .comm-title {
	font-size: 18px;
	font-size: 1.8rem;
	color: #1f1f1f
}

#home .comm-title span {
	font-size: 40px;
	font-size: 4rem;
	display: block;
	font-weight: lighter;
	font-family: "Kozuka Gothic Pr6N"
}

#home .comm-service,
#home .comm-products,
#home .comm-news {
	padding: 50px 0
}

#home .comm-service a,
#home .comm-products a,
#home .comm-news a {
	text-decoration: none
}

#home .comm-service {
	text-align: center;
	font-size: 0
}

#home .comm-service .comm-title span {
	color: #bababa
}

#home .comm-service .slogan {
	font-size: 14px;
	font-size: 1.4rem;
	margin: 30px auto 50px;
	padding: 0 20px;
	color: #777;
	font-weight: bold
}

#home .comm-service li {
	font-size: 14px;
	font-size: 1.4rem;
	display: inline-block;
	vertical-align: top;
	width: 25%;
	float: left;
	font-weight: bold
}

#home .comm-service h3 {
	font-size: 17px;
	font-size: 1.7rem;
	margin: 50px auto 10px
}

#home .comm-products {
	background: url(../images/comm-products-bg.png) center repeat-y #f7b400
}

#home .comm-products .figure {
	float: left;
	width: 50%;
	text-align: center;
	margin: 30px 0;
	padding: 0 40px
}

#home .comm-products .comm-title {
	margin: 0 auto 20px;
	float: right;
	width: 50%;
	text-align: left
}

#home .comm-products .comm-title span {
	color: #fff
}

#home .comm-products ul {
	margin: 0 0 0 50%;
	width: 50%;
	font-size: 0
}

#home .comm-products li {
	font-size: 19px;
	font-size: 1.9rem;
	position: relative;
	margin: 0 0 20px;
	padding: 0 0 0 23px;
	display: inline-block;
	vertical-align: top;
	width: 32%
}

#home .comm-products li:before,
#home .comm-products li:after {
	content: '';
	display: block;
	position: absolute
}

#home .comm-products li:before {
	border-radius: 50%;
	left: 0;
	top: 5px;
	content: '';
	display: block;
	width: 18px;
	height: 18px;
	background: #24495e
}

#home .comm-products li:after {
	left: 6px;
	top: 10px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 4px 0 4px 8px;
	border-color: transparent transparent transparent #fff
}

#home .comm-products .more {
	margin: 30px 0 0 50%
}

#home .comm-news {
	text-align: center;
	padding: 50px 0
}

#home .comm-news .comm-title {
	margin: 0 auto 30px
}

#home .comm-news .comm-title span {
	color: #d7d7d7
}

#home .comm-news li {
	border-radius: 3px;
	display: inline-block;
	vertical-align: top;
	margin: 0 1% 30px;
	width: 22%
}

#home .comm-news a {
	text-align: left;
	text-decoration: none;
	background: #fff;
	padding: 10px 10px 30px;
	display: block;
	max-width: 240px;
	overflow: hidden;
	margin: 0 auto
}

#home .comm-news .figure:after {
	content: '';
	display: block;
	height: 5px;
	background: #14afbe
}

#home .comm-news h3 {
	margin: 10px auto 5px;
	color: #000
}

#home .comm-news .date {
	font-size: 13px;
	font-size: 1.3rem;
	color: #666;
	display: block;
	margin: 0 auto 5px
}

#home .comm-news p {
	font-size: 13px;
	font-size: 1.3rem;
	color: #000
}

#home .comm-news .more {
	width: 140px;
	margin: 50px auto 0
}

#company {
	font-size: 15px;
	font-size: 1.5rem;
	padding: 50px 0 0
}

#company .inner-wrap {
	position: relative;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 20px
}

#company .sec1 {
	text-align: center;
	line-height: 2
}

#company .sec1 .title,
#company .sec1 #case .item-group h3,
#case .item-group #company .sec1 h3 {
	line-height: 1.8
}

#company .sec1 .title:after,
#company .sec1 #case .item-group h3:after,
#case .item-group #company .sec1 h3:after {
	content: '';
	display: block;
	width: 30px;
	height: 5px;
	background: #f7b400;
	margin: 10px auto 0
}

#company .history {
	position: relative;
	background: #f0f2f4
}

#company .history .text,
#company .history .figure {
	display: inline-block;
	vertical-align: top
}

#company .history .figure {
	width: 48%
}

#company .history .text {
	width: 50%;
	padding: 5% 0
}

#company .history ul,
#company .history li {
	margin: 0;
	padding: 0;
	list-style: none outside none;
	overflow: hidden
}

#company .history ul {
	display: table;
	table-layout: fixed
}

#company .history li {
	display: table-row
}

#company .history li span {
	display: table-cell;
	vertical-align: top;
	padding: 5px 0 5px 30px;
	text-align: left
}

#company .history li strong {
	position: relative;
	white-space: nowrap;
	padding: 5px 45px 5px 5px;
	display: table-cell;
	font-weight: normal;
	text-align: left;
	vertical-align: top
}

#company .history li strong:before,
#company .history li strong:after {
	position: absolute;
	display: block;
	content: '';
	background: url(../images/icon-dot.png) center no-repeat
}

#company .history li strong:before {
	width: 1px;
	height: 100%;
	border-left: 1px solid #ccc;
	right: 6.5px;
	top: 0
}

#company .history li strong:after {
	width: 13px;
	height: 13px;
	right: 0;
	top: 15px;
	margin: -6.5px 0 0
}

#company .history li.first strong:before {
	height: 85%;
	top: 15%
}

#company .history li.last strong:before {
	height: 25%;
	top: 0
}

#company .sec2 .figure,
#company .sec2 .text {
	display: inline-block;
	vertical-align: middle;
	width: 48%
}

#company .sec2 .text {
	padding: 0 40px
}

#company .check-list,
#company li {
	margin: 0;
	padding: 0;
	list-style: none
}

#company .check-list li {
	padding: 5px 5px 5px 25px;
	background: url(../images/icon-check1.png) left 7px no-repeat
}

#service {
	padding: 50px 0
}

#service .inner-wrap {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 20px
}

#service .text,
#service .figure {
	display: inline-block;
	vertical-align: middle
}

#service .text {
	width: 40%
}

#service .figure {
	width: 58%
}

#service dl,
#service dt,
#service dd {
	margin: 0;
	padding: 0;
	list-style: none outside none;
	font-weight: bold
}

#service dt {
	margin: 0 auto 10px
}

#service dt span {
	font-size: 32px;
	font-size: 3.2rem;
	font-family: sans-serif;
	font-style: italic;
	font-weight: normal;
	display: inline-block;
	vertical-align: text-bottom;
	width: 30px;
	padding: 0 4px;
	line-height: 1.4;
	margin: 0 15px 0 0;
	background: url(../images/icon-label.png) center bottom no-repeat
}

#service dd {
	color: #666;
	margin: 10px 0 10px 30px;
	padding: 5px 5px 5px 25px;
	background: url(../images/icon-check1.png) left 7px no-repeat
}

#products .inner-wrap {
	position: relative;
	max-width: 1280px;
	margin: 0 auto;
	padding: 60px 20px;
	overflow: hidden;
	font-weight: bold
}

#products .figure-sec {
	position: relative;
	text-align: center;
	background: #f8f8fc
}

#products .figure-sec:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: -5px;
	width: 100%;
	height: 5px;
	-moz-box-shadow: 0 5px 5px #ccc;
	-webkit-box-shadow: 0 5px 5px #ccc;
	box-shadow: 0 5px 5px #ccc;
	z-index: 1
}

#products .figure-sec h1 {
	margin: 0 auto 50px
}

#products .f-l {
	float: left
}

#products .f-r {
	float: right
}

#products .inline {
	display: inline-block;
	vertical-align: top
}

#products .bg-r {
	position: absolute;
	right: 0;
	top: 0
}

#products .figure img {
	display: block;
	margin: 0 auto
}

#products .text {
	position: relative;
	z-index: 1
}

#products .text dl,
#products .text dt,
#products .text dd {
	margin: 0;
	padding: 0;
	list-style: none outside none
}

#products .text dt {
	margin: 0 auto 10px
}

#products .text dt span {
	font-size: 32px;
	font-size: 3.2rem;
	font-family: sans-serif;
	font-style: italic;
	font-weight: normal;
	display: inline-block;
	vertical-align: text-bottom;
	width: 35px;
	padding: 0 4px;
	line-height: 1.4;
	margin: 0 15px 0 0;
	background: url(../images/icon-label3.png) center bottom no-repeat
}

#products .text dd {
	color: #666;
	margin: 5px 0 5px 30px;
	padding: 2px 5px 2px 25px;
	background: url(../images/icon-check1.png) left 7px no-repeat
}

#products .sec2 {
	background: #f0f2f4
}

#products .info1 .sec1 .text {
	width: 55%
}

#products .info1 .sec1 .figure {
	width: 45%
}

#products .info1 .sec1 ul,
#products .info1 .sec1 li {
	margin: 0;
	padding: 0;
	list-style: none outside none
}

#products .info1 .sec1 li {
	position: relative;
	padding: 15px 40px 10px
}

#products .info1 .sec1 li span {
	font-size: 24px;
	font-size: 2.4rem;
	position: absolute;
	left: 0;
	top: 0;
	width: 30px;
	padding: 0 5px;
	font-style: italic;
	background: url(../images/icon-label2.png) center bottom no-repeat
}

#products .info2 .sec1 .figure,
#products .info2 .sec1 .text,
#products .info2 .sec4 .figure,
#products .info2 .sec4 .text {
	width: 50%
}

#products .info2 .sec3 {
	text-align: center
}

#products .info2 .sec3 .inner-wrap {
	padding-bottom: 0
}

#products .info2 .sec3 .f-l {
	width: 50%
}

#products .info2 .sec3 .text {
	display: inline-block;
	text-align: left
}

#products .info2 .sec3 .figure {
	margin: 30px 0
}

#products .info2 .sec4 .inner-wrap {
	padding-top: 0
}

#products .info3 .sec1 .text {
	width: 55%
}

#products .info3 .sec1 .figure {
	width: 45%
}

#products .info3 .sec3 .f-l {
	width: 50%
}

#products .info4 .f-l dl {
	margin: 0 0 30px
}

#products .info4 .sec1 .f-l {
	width: 50%
}

#products .info4 .sec1 .text {
	width: 60%;
	overflow: hidden
}

#products .info4 .sec1 .figure {
	width: 40%
}

#products .info4 .sec2 .f-l,
#products .info4 .sec2 .f-r,
#products .info4 .sec3 .f-l,
#products .info4 .sec3 .f-r {
	width: 50%
}

#products .info5 .inline {
	width: 33%;
	margin: 0 auto 30px
}

#products .info5 .bg-r {
	top: auto;
	bottom: 0
}

#products .info6 .spec {
	background: url(../images/bg-products6.png) center bottom no-repeat
}

#products .info6 .spec .text {
	position: absolute;
	width: 100%
}

#products .info6 .spec .title,
#products .info6 .spec #case .item-group h3,
#case .item-group #products .info6 .spec h3 {
	padding: 0 0 0 50px;
	background: url(../images/icon-label3.png) left center no-repeat
}

#products .info6 .spec .figure {
	float: right;
	width: 70%
}

#products .info6 .spec .figure img {
	display: block
}

#products .info6 .spec ul,
#products .info6 .spec li {
	margin: 0;
	padding: 0;
	list-style: none outside none
}

#products .info6 .spec li {
	margin: 0 0 30px
}

#products .info6 .spec li h3 {
	margin: 0 auto 10px;
	padding: 5px 0 5px 40px;
	background: url(../images/icon-note1.png) left center no-repeat
}

#products .info6 .spec li p {
	margin: 0 0 0 40px
}

#products .info6 .spec .inline {
	margin: 0 50px 30px 0
}

#products .info6 .spec .last {
	width: 30%
}

#news {
	padding: 80px 20px;
	background: #f8f8f8
}

#news .info-nav,
#news .list-group,
#news .news-detail {
	max-width: 1280px;
	margin: 0 auto
}

#news .info-nav {
	font-size: 0;
	margin: 0 auto 30px;
	text-align: center
}

#news .info-nav ul,
#news .info-nav li {
	margin: 0;
	padding: 0;
	list-style: none outside none
}

#news .info-nav li {
	font-size: 17px;
	font-size: 1.7rem;
	position: relative;
	display: inline-block;
	vertical-align: top;
	margin: 0 6px;
	background: #fff;
	border: 1px solid #efefef;
	width: 160px;
	max-width: 40%
}

#news .info-nav li a {
	display: block;
	padding: 10px 0;
	border-bottom: 3px solid #ddd;
	text-decoration: none
}

#news .info-nav li.on {
	color: #fff;
	background: #03b2c3
}

#news .info-nav li.on a {
	border-bottom: 3px solid #028d9d
}

#news .list-group {
	max-width: 1000px;
	margin: 0 auto
}

#news .list-group ul,
#news .list-group li {
	margin: 0;
	padding: 0;
	list-style: none outside none
}

#news .list-group li {
	border: 1px solid #efefef;
	border-top: 0 none
}

#news .list-group li:hover a:after {
	content: ''
}

#news .list-group li:first-child {
	border-top: 1px solid #efefef
}

#news .list-group a {
	position: relative;
	text-decoration: none;
	display: block;
	padding: 20px 30px;
	overflow: hidden
}

#news .list-group a:after {
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 5px;
	background: #14afbe
}

#news .list-group .figure {
	display: inline-block;
	vertical-align: middle;
	width: 22%
}

#news .list-group .figure img {
	display: block
}

#news .list-group .text {
	display: inline-block;
	vertical-align: middle;
	width: 75%;
	margin: 0 0 0 2%
}

#news .list-group .date {
	font-size: 13px;
	font-size: 1.3rem;
	display: block;
	margin: 0 auto 10px;
	color: #535353
}

#news .list-group h3 {
	font-size: 17px;
	font-size: 1.7rem;
	color: #1f1f1f;
	margin: 0 auto 10px
}

#news .list-group p {
	color: #666
}

#news .news-detail {
	max-width: 1000px;
	padding: 30px 10%;
	border: 1px solid #efefef;
	background: #fff
}

#news .news-detail .title,
#news .news-detail #case .item-group h3,
#case .item-group #news .news-detail h3 {
	font-size: 30px;
	font-size: 3rem;
	color: #000
}

#news .news-detail .date {
	font-size: 13px;
	font-size: 1.3rem;
	margin: 10px 0 0;
	color: #999
}

#news .news-detail .date span {
	font-weight: normal
}

#news .news-detail .text {
	margin: 30px auto 0;
	line-height: 1.6
}

#news .news-detail .text .foreword {
	color: #018c9d;
	margin: 20px 0 0
}

#news .news-detail .text h2 {
	font-size: 24px;
	font-size: 2.4rem;
	font-weight: normal;
	color: #000;
	text-shadow: .5px 0 0 #000;
	position: relative;
	margin: 40px 0 0
}

#news .news-detail .text h2:before {
	display: block;
	width: 25px;
	height: 21px;
	background: url(../images/icon-arr.png) center no-repeat;
	position: absolute;
	left: 0;
	top: 8px
}

#news .news-detail .text h3 {
	color: #7ca113;
	padding: 2px 0 5px
}

#news .news-detail .text p {
	color: #555;
	padding: 0 0 10px
}

#news .news-detail .text p a {
	color: #000;
	font-weight: bold;
	text-decoration: underline
}

#news .news-detail .text .red {
	color: #d90000
}

#news .news-detail .text .figure {
	border: 1px solid #ddd;
	background: #f9f9f9
}

#news .news-detail .text .figure figcaption {
	color: #000;
	padding: 15px
}

#news .news-detail .text .figure figcaption a {
	text-decoration: none
}

#news .news-detail .text .summarize {
	padding: 45px 5% 25px;
	font-size: 16px;
	font-size: 1.6rem;
	color: #000;
	text-shadow: .5px 0 0 #000;
	border-bottom: 1px solid #ddd
}

#news .news-detail .text .sign {
	color: #777;
	padding: 10px 0 50px;
	text-align: right;
	font-style: italic
}

#news .news-detail .news-head {
	margin: 0 auto 10px;
	overflow: hidden
}

#news .news-detail .btn-wrap {
	margin: 50px auto 0;
	overflow: hidden
}

#news .news-detail .btn-wrap a {
	text-decoration: none
}

#news .news-detail .btn-back,
#news .news-detail .btn-prev,
#news .news-detail .btn-next {
	display: inline-block;
	vertical-align: middle
}

#news .news-detail .btn-back {
	float: left
}

#news .news-detail .article-chose {
	float: right
}

#news .news-detail .article-chose a:before {
	content: '';
	width: 13px;
	height: 13px;
	margin: 0 6px 0 5px;
	display: inline-block;
	vertical-align: middle;
	background: url(../images/icon-slash.png) center no-repeat
}

#news .news-detail .article-chose a:first-child:before {
	content: none
}

#faq {
	padding: 0 0 80px
}

#faq .inner-wrap {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 20px
}

#faq .info-nav {
	font-size: 16px;
	font-size: 1.6rem;
	max-width: 1280px;
	margin: 0 auto;
	padding: 60px 20px 0
}

#faq .info-nav .web-nav {
	display: block
}

#faq .info-nav .web-nav ul {
	display: table;
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse
}

#faq .info-nav .web-nav li {
	display: table-cell;
	vertical-align: middle;
	border: 1px solid #eee;
	text-align: center;
	border-bottom: 3px solid #028d9d;
	background: #fff;
	background: -moz-linear-gradient(top, #fff 0%, #eee 100%);
	background: -webkit-linear-gradient(top, #fff 0%, #eee 100%);
	background: linear-gradient(to bottom, #fff 0%, #eee 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0)
}

#faq .info-nav .web-nav li:hover,
#faq .info-nav .web-nav li.on {
	background: #03b2c3;
	color: #fff
}

#faq .info-nav .web-nav a {
	display: block;
	text-decoration: none;
	padding: 15px 0 12px
}

#faq .info-nav .mobile-nav {
	display: none
}

#faq .list-group>ul,
#faq .list-group .item {
	margin: 0;
	padding: 0;
	list-style: none outside none
}

#faq .list-group .item {
	margin: 0 auto 20px
}

#faq .list-group .item.on .text {
	display: block
}

#faq .list-group .title,
#faq .list-group #case .item-group h3,
#case .item-group #faq .list-group h3 {
	font-size: 16px;
	font-size: 1.6rem;
	margin: 0;
	padding: 0 0 10px;
	border-bottom: 1px dotted #ccc;
	cursor: pointer
}

#faq .list-group .title span,
#faq .list-group #case .item-group h3 span,
#case .item-group #faq .list-group h3 span {
	font-size: 33px;
	font-size: 3.3rem;
	color: #f7b400;
	font-family: "Kozuka Gothic Pr6N";
	font-weight: 200;
	display: inline-block;
	vertical-align: sub;
	text-align: center;
	margin: 0 10px 0 0;
	min-width: 80px
}

#faq .text {
	background: #f5f7f8;
	border-bottom: 1px dotted #ccc;
	padding: 30px 25px;
	display: none
}

#faq .text p {
	margin: 0 auto 10px
}

#case .inner-wrap {
	max-width: 1280px;
	margin: 0 auto;
	padding: 50px 0 80px
}

#case .item-group ul,
#case .item-group li {
	margin: 0 auto;
	padding: 0;
	list-style: outside none none
}

#case .item-group ul {
	font-size: 0;
	background: url(../images/bg-border.png) center no-repeat
}

#case .item-group ul:after {
	content: '';
	display: block;
	margin: 30px 0 0;
	height: 25px;
	background: url(../images/bg-border2.png) center no-repeat
}

#case .item-group li {
	font-size: 16px;
	font-size: 1.6rem;
	position: relative;
	width: 50%;
	display: inline-block;
	vertical-align: top;
	color: #666;
	padding: 0 5%
}

#case .item-group h3 {
	margin: 10px 0;
	color: #000
}

#case .item-group .figure {
	height: 110px;
	line-height: 110px;
	overflow: hidden
}

#contact .inner-wrap {
	max-width: 1280px;
	margin: 0 auto;
	padding: 50px 20px 80px
}

#contact .g-map {
	border-top: 3px solid #ddd;
	height: 320px
}

@media screen and (max-width:1280px) {
	#header .facebook {
		right: 1.5%
	}

	#banner .item h1 {
		font-size: 40px;
		font-size: 4rem
	}

	#banner .item h2 {
		font-size: 30px;
		font-size: 3rem
	}

	#footer .addr .contact-info .icon-sky {
		padding: 0 0 0 5%
	}
}

@media screen and (max-width:1200px) {
	#main-nav {
		margin: 0 7% 0 0
	}

	#footer .addr {
		width: 30%
	}
}

@media screen and (max-width:1024px) {
	#main-nav>ul>li {
		margin: 0 8px
	}

	#main-nav>ul>li>a {
		padding: 33px 10px 33px
	}

	#banner .item .text {
		top: 20%
	}

	#footer .addr li {
		display: block;
		margin: 0 auto 10px
	}

	#footer .addr .contact-info h3 {
		margin: 30px 0 10px
	}

	#footer .addr .contact-info .icon-sky {
		padding: 0 0 0 5px
	}

	#products .sec2 .figure {
		filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
		opacity: .4
	}
}

@media screen and (min-width:769px) and (max-width:1023px) {

	#container,
	#header {
		width: 1024px
	}
}

@media screen and (min-width:769px) {

	#main-nav>ul>li:hover,
	#main-nav>ul>li.on {
		color: #000
	}

	#main-nav>ul>li:hover .sub-nav,
	#main-nav>ul>li.on .sub-nav {
		display: block
	}

	#main-nav>ul>li:hover>a:after,
	#main-nav>ul>li.on>a:after {
		content: ""
	}

	#news .news-detail {
		padding: 60px
	}
}

@media screen and (max-width:768px) {
	#header .inner-wrap {
		padding: 20px
	}

	#header .inner-wrap:before {
		content: '';
		display: block;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 1px;
		background: #ccc
	}

	#header .facebook {
		top: 50%;
		right: 75px;
		margin: -17px 0 0;
		width: 34px;
		height: 34px
	}

	#header .facebook a {
		line-height: 34px
	}

	#banner .item .text {
		top: 30%
	}

	#banner .item .text:after {
		content: none
	}

	#banner .item h1 {
		font-size: 30px;
		font-size: 3rem
	}

	#banner .item h2 {
		font-size: 20px;
		font-size: 2rem
	}

	#banner[data-info] {
		font-size: 17px;
		font-size: 1.7rem;
		height: 200px;
		color: #333;
		text-align: center
	}

	#banner[data-info] .title,
	#banner[data-info] #case .item-group h3,
	#case .item-group #banner[data-info] h3 {
		font-size: 36px;
		font-size: 3.6rem;
		margin: 60px auto 0;
		position: relative;
		color: #111
	}

	#banner[data-info="products"] {
		height: 240px
	}

	#logo {
		position: relative;
		left: 0;
		top: 0
	}

	#main-nav {
		position: absolute;
		width: 100%;
		left: -100%;
		margin: 20px 0 0;
		padding: 0 20px 60px;
		background: #fff
	}

	#main-nav>ul>li {
		display: block;
		width: 100%;
		margin: 0;
		padding: 0;
		border-bottom: 1px solid #eee
	}

	#main-nav>ul>li a {
		margin: 0;
		padding: 8px 0
	}

	#main-nav>ul>li a:after {
		content: none
	}

	#main-nav>ul>li.on {
		color: #000
	}

	#main-nav .sub-nav {
		display: block;
		position: relative;
		white-space: normal
	}

	#main-nav .sub-nav>ul {
		margin: 0;
		padding: 0
	}

	#main-nav .sub-nav>ul li {
		color: #666;
		margin: 0;
		display: block;
		border-top: 1px dashed #eee;
		background: url(../images/icon-arr02.png) left center no-repeat
	}

	#main-nav .sub-nav>ul li.on,
	#main-nav .sub-nav>ul li:hover {
		color: #000;
		background: url(../images/icon-arr02.png) left center no-repeat
	}

	#main-nav .last {
		margin: 30px 0 0
	}

	#main-nav.on {
		left: 0
	}

	.sub-nav-bg.on {
		display: none
	}

	#nav-btn {
		display: block
	}

	.lang-wrap {
		font-size: 16px;
		font-size: 1.6rem;
		background: no-repeat
	}

	.lang-wrap ul {
		background: no-repeat
	}

	.lang-wrap:after {
		content: none
	}

	.lang-wrap .languages {
		display: none
	}

	.lang-wrap .sub-node {
		position: relative;
		display: block
	}

	.lang-wrap .sub-node li {
		display: inline-block;
		vertical-align: middle
	}

	#mask-bg.on {
		filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
		opacity: .8;
		height: 100%
	}

	#footer .footer-nav {
		float: none;
		width: auto;
		background: #fafafa;
		overflow: hidden
	}

	#footer .footer-nav li {
		width: 25%;
		margin: 20px 0 10px;
		padding: 0 20px;
		float: left
	}

	#footer .footer-logo {
		position: relative;
		left: 0;
		top: 0;
		display: inline-block;
		vertical-align: top;
		margin: 0 20px
	}

	#footer .footer-logo-app1 {
		position: relative;
		left: 0;
		top: 0;
		display: inline-block;
		vertical-align: top;
		margin: 0 20px
	}

	#footer .footer-logo-app2 {
		position: relative;
		left: 0;
		top: 0;
		display: inline-block;
		vertical-align: top;
		margin: 0 20px
	}

	#footer .addr {
		text-align: left;
		width: auto;
		display: inline-block;
		vertical-align: top;
		margin: 0 20px
	}

	#footer .copyright {
		margin: 0;
		padding: 20px;
		border-top: 1px solid #eee
	}

	.go-top {
		font-size: 12px;
		font-size: 1.2rem;
		right: 20px
	}

	.go-top:before {
		width: 30px;
		height: 30px
	}

	.go-top.end {
		top: -65px
	}

	.info-nav {
		border-bottom: 0 none
	}

	.info-nav li {
		margin: 0;
		display: block;
		border-bottom: 1px solid #d2d2d2
	}

	.info-nav li a {
		display: block;
		width: 100%;
		padding: 15px 0
	}

	.contact-form ul {
		width: 50%;
		padding: 0 20px 0 0
	}

	.contact-form ul:first-child {
		margin: 0
	}

	.contact-form .sec-code img {
		float: none
	}

	.contact-form .sec-code input[type="text"] {
		display: block;
		width: 100%;
		margin: 10px auto 0;
		max-width: none;
		float: none
	}

	#home .comm-service li {
		width: 50%;
		margin: 0 auto 50px
	}

	#home .comm-service h3 {
		margin: 15px auto 10px
	}

	#home .comm-products {
		padding: 50px 20px;
		text-align: center
	}

	#home .comm-products .figure,
	#home .comm-products .comm-title {
		text-align: center;
		float: none;
		width: auto;
		margin: 0 auto
	}

	#home .comm-products .comm-title {
		margin: 0 auto 30px
	}

	#home .comm-products ul {
		display: inline-block;
		vertical-align: top;
		text-align: left;
		width: auto;
		margin: 30px auto
	}

	#home .comm-products .more {
		margin: 0 auto
	}

	#home .comm-news li {
		width: 45%
	}

	#home .comm-news .more {
		margin: 20px auto
	}

	#company {
		padding: 0
	}

	#company .sec1 .title,
	#company .sec1 #case .item-group h3,
	#case .item-group #company .sec1 h3,
	#company .sec1 .figure,
	#company .history .title,
	#company .history #case .item-group h3,
	#case .item-group #company .history h3,
	#company .history .figure,
	#company .sec2 .title,
	#company .sec2 #case .item-group h3,
	#case .item-group #company .sec2 h3,
	#company .sec2 .figure {
		text-align: center
	}

	#company .sec1 .text,
	#company .history .text,
	#company .sec2 .text {
		padding: 20px 0
	}

	#company .sec1 .text {
		text-align: left
	}

	#company .sec1 .title,
	#company .sec1 #case .item-group h3,
	#case .item-group #company .sec1 h3,
	#company .sec1 .figure {
		text-align: center
	}

	#company .history .figure,
	#company .history .text,
	#company .sec2 .figure,
	#company .sec2 .text {
		float: none;
		width: 100%;
		display: block
	}

	#company .history .figure,
	#company .sec2 .figure {
		text-align: center
	}

	#company .history li {
		display: table-row
	}

	#company .history li span {
		padding: 5px 0 5px 10px
	}

	#company .history li strong {
		padding: 5px 20px 5px 0
	}

	#service {
		position: relative;
		overflow: hidden
	}

	#service .text,
	#service .figure {
		display: block;
		width: 100%
	}

	#products .inner-wrap {
		padding: 30px 20px
	}

	#products .figure-sec {
		padding: 30px 20px 50px
	}

	#products .f-l,
	#products .f-r {
		float: none
	}

	#products .f-l:first-child,
	#products .f-r:first-child {
		margin: 0 auto 20px
	}

	#products .info1 .sec1 .text,
	#products .info1 .sec1 .figure {
		width: auto
	}

	#products .info2 .sec1 .text,
	#products .info2 .sec1 .figure,
	#products .info2 .sec4 .text,
	#products .info2 .sec4 .figure {
		width: auto
	}

	#products .info2 .sec1 .figure,
	#products .info2 .sec4 .figure {
		margin: 20px auto 0
	}

	#products .info2 .sec3 .inner-wrap {
		padding-bottom: 30px
	}

	#products .info2 .sec3 .f-l {
		width: auto
	}

	#products .info2 .sec3 .text {
		display: block
	}

	#products .info2 .sec3 .figure {
		margin: 20px auto 0
	}

	#products .info3 .sec1 .text,
	#products .info3 .sec1 .figure {
		width: auto
	}

	#products .info3 .sec3 .f-l {
		width: auto
	}

	#products .info4 .f-l dl {
		margin: 0 0 30px
	}

	#products .info4 .sec1 .f-l,
	#products .info4 .sec1 .f-r,
	#products .info4 .sec2 .f-l,
	#products .info4 .sec2 .f-r,
	#products .info4 .sec3 .f-l,
	#products .info4 .sec3 .f-r {
		width: auto
	}

	#products .info5 .inline {
		width: 48%
	}

	#products .info5 .bg-r {
		filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
		opacity: .4
	}

	#products .info6 .spec {
		padding: 50px 0
	}

	#products .info6 .spec .last {
		width: auto
	}

	#products .info6 .spec .text {
		position: relative;
		width: auto
	}

	#products .info6 .spec .figure {
		float: none;
		width: auto
	}

	#news .news-detail .text .foreword {
		margin: 20px 0 15px
	}

	#news .news-detail .text .part {
		padding: 20px 0 20px 30px
	}

	#faq .info-nav .web-nav {
		display: none
	}

	#faq .info-nav .mobile-nav {
		display: block
	}

	#faq .info-nav .mobile-nav select {
		width: 100%
	}

	#faq .list-group .title,
	#faq .list-group #case .item-group h3,
	#case .item-group #faq .list-group h3 {
		font-size: 15px;
		font-size: 1.5rem
	}

	#faq .list-group .title span,
	#faq .list-group #case .item-group h3 span,
	#case .item-group #faq .list-group h3 span {
		font-size: 20px;
		font-size: 2rem;
		min-width: 40px;
		margin: 0 5px 0 0
	}

	#faq .list-group .text {
		padding: 20px 15px
	}
}

@media screen and (max-width:640px) {

	.title,
	#case .item-group h3 {
		font-size: 18px;
		font-size: 1.8rem
	}

	body {
		font-size: 14px;
		font-size: 1.4rem
	}

	#banner .item .text {
		font-size: 12px;
		font-size: 1.2rem
	}

	#banner .item h1 {
		font-size: 18px;
		font-size: 1.8rem
	}

	#banner .item h2 {
		font-size: 14px;
		font-size: 1.4rem
	}

	#banner .item p {
		display: none
	}

	#banner[data-info] {
		font-size: 14px;
		font-size: 1.4rem;
		height: 180px
	}

	#banner[data-info] .title,
	#banner[data-info] #case .item-group h3,
	#case .item-group #banner[data-info] h3 {
		font-size: 24px;
		font-size: 2.4rem;
		margin: 50px auto 0
	}

	#main-nav>ul>li {
		font-size: 14px;
		font-size: 1.4rem
	}

	#footer .footer-nav li {
		width: 33%
	}

	#footer .footer-logo {
		width: 50%
	}

	#footer .addr {
		display: block;
		margin: 30px 20px
	}

	#home .comm-products li {
		display: block;
		width: auto;
		margin: 0 auto 30px
	}

	#home .comm-news {
		text-align: center
	}

	#home .comm-news li {
		width: 50%
	}

	#products .text dd {
		margin: 5px 0 5px 10px
	}

	#products .bg-r {
		position: relative;
		top: auto;
		bottom: auto;
		left: auto;
		right: auto
	}

	#products .sec2 .inner-wrap {
		padding-bottom: 0
	}

	#products .sec2 .bg-r {
		filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
		opacity: 1;
		margin: 30px auto 0
	}

	#products .info5 .bg-r {
		position: absolute
	}

	.contact-form ul {
		width: 100%;
		float: none;
		padding: 0
	}

	.contact-form li>div {
		display: block;
		padding: 5px
	}

	.contact-form .sec-code input[type="text"] {
		width: auto;
		margin: 10px 0
	}

	.contact-form .sec-code .btn-wrap {
		text-align: left;
		margin: 10px 0
	}
}

@media screen and (max-width:480px) {
	#home .comm-service li {
		width: 100%;
		margin: 0 auto 30px
	}

	#home .comm-service .comm-title {
		margin: 0 auto 30px
	}

	#home .comm-news {
		text-align: center
	}

	#home .comm-news li {
		width: auto
	}

	#products .info5 .inline {
		display: block;
		width: 100%;
		text-align: left
	}

	#news {
		padding: 30px 20px 80px
	}

	#news .list-group .figure,
	#news .list-group .text {
		display: block;
		width: auto
	}

	#news .list-group .figure {
		margin: 0 auto 10px
	}

	#news .news-detail .text h2 {
		margin: 25px 0 0
	}

	#news .news-detail .text .summarize {
		padding: 25px 0
	}

	#news .news-detail .text .sign {
		padding: 10px 0 0
	}

	#case .inner-wrap {
		padding: 30px 0 80px
	}

	#case .item-group ul {
		background: none
	}

	#case .item-group ul:after {
		content: none
	}

	#case .item-group li {
		font-size: 14px;
		font-size: 1.4rem;
		width: 100%;
		padding: 0 20px 50px;
		margin: 0 auto 10px
	}

	#case .item-group li:after {
		position: absolute;
		width: 100%;
		left: 0;
		bottom: 0;
		content: '';
		display: block;
		height: 25px;
	}
}

@media screen and (max-width:360px) {
	#footer .footer-nav li {
		width: 50%
	}
}