@charset "utf-8";
/* CSS Document */

/*reset*/
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,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
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;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}
html{
	height:100%;
}
body {
	line-height: 1.5em;
	font-family:Arial,微軟正黑體,Microsoft JhengHei,新細明體,sans-serif;
	height:100%;
	font-size:16px;
}
strong{
	font-weight:bold;
	color:#0078D0;
	font-size: 1.2em;
    line-height: 2em;
    letter-spacing: .1em;
}
ol, ul, li {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

/*start*/
header{
height: 93px;
    width: 100%;
    position: absolute;
	background-color:#FFFFFF;
    z-index: 990;
    box-shadow: 0 1px 10px rgba(0,0,0,.3);
    background-image: url(images/ice_age.png);
}
img{
	max-width:100%;
}
nav{
	width:100%;
	margin:0 auto;
}
nav ul{
	position: absolute;
    right: 7%;
	padding-top: 17px;
}
nav ul li{
	display:inline;
}
nav ul li a{
	padding:0 .8em;
	color:#888888;
	letter-spacing:.1em;
	display: inline-block;
}
.navBox{
	width:1170px; 
	margin:0 auto;
	position: relative;
}
.language{
	font-size:.8em;
	position: absolute;
    right: 2%;
    top: 35px;
}
.language a{ 
	font-size:.8em;
	transition:all .3s ease;
}
.language a:hover{
	color:#e4e4e4;
}
*:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.btn{
	width:55px; 
	height:55px; 
	line-height: 105px;
	background-image:url(images/icon5.png); 
}
.btn1{
	background-position:-6px 0;
	transition: opacity .3s ease;
	opacity:1;
}
.btn1:hover{
	opacity:0;
}
.btn1hover{
	background-position:-62px 0;
	position:absolute;
	top:17px;
	transition: opacity .3s ease;
	opacity:0;
}
.btn1hover:hover{
	opacity:1;
}
.btn1hover:after{
	font-size:.8em;
	content:"首頁";
	width:100px;
	position:absolute;
	top:10px;
	left: 11px;
}
.btn2{
	background-position:-118px 0;
	transition: opacity .3s ease;
	opacity:1;
}
.btn2:hover{
	opacity:0;
}
.btn2hover{
	background-position:-174px 0;
	position:absolute;
	top:17px;
	transition: opacity .3s ease;
	opacity:0;
}
.btn2hover:hover{
	opacity:1;
}
.btn2hover:after{
	font-size:.8em;
	content:"鉌鑫簡介";
	position:absolute;
	top:10px;
	width:100px;
	left: -2px;
}
.btn3{
	background-position:-229px 0;
	transition: opacity .3s ease;
	opacity:1;
}
.btn3:hover{
	opacity:0;
}
.btn3hover{
	background-position:-285px 0;
	position:absolute;
	top:17px;
	transition: opacity .3s ease;
	opacity:0;
}
.btn3hover:hover{
	opacity:1;
}
.btn3hover:after{
	font-size:.8em;
	content:"訂購須知";
	position:absolute;
	top:10px;
	width:100px;
}
.btn4{
	background-position:-341px 0;
	transition: opacity .3s ease;
	opacity:1;
}
.btn4:hover{
	opacity:0;
}
.btn4hover{
	background-position:-397px 0;
	position:absolute;
	top:17px;
	transition: opacity .3s ease;
	opacity:0;
}
.btn4hover:hover{
	opacity:1;
}
.btn4hover:after{
	font-size:.8em;
	content:"聯絡鉌鑫";
	position:absolute;
	top:10px;
	width:100px;
	left: -2px;
}
.btn5{
	background-position:-452px 0;
	transition: opacity .3s ease;
	opacity:1;
}
.btn5:hover{
	opacity:0;
}
.btn5hover{
	background-position:-508px 0;
	position:absolute;
	top:17px;
	transition: opacity .3s ease;
	opacity:0;
}
.btn5hover:hover{
	opacity:1;
}
.btn5hover:after{
	font-size:.8em;
	content:"產品介紹";
	position:absolute;
	top:10px;
	left:-2px;
	width:100px;
}
#icon2{
    height: 100%;
    padding-bottom: 80px;
}
#icon2 ul{
	border-top: #999999 1px dotted;
	padding-top: 50px;
	padding-left: 45px;
}
#icon2 ul li{
    display: inline-block;
	width:98px; 
	height:120px; 
	position:relative;
	padding: 25px;
}

#icon2 ul li:first-child{display:none;}

#icon2 ul li a{
	color:#000000;
}
.icon2btn{
	width:95px; 
	height:95px; 
	line-height: 110px;
	background:url(images/icon-04.png) no-repeat; 
}
.btn11{
	background-position:-5px 0;
	transition: opacity .3s ease;
	opacity:1;
	position:absolute;
	left: 0;
}
.btn11:hover{
	opacity:0;
}
.btn11hover{
	background-position:-108px 0;
	position:absolute;
	transition: opacity .3s ease;
	opacity:0;
	left: 0;
	height:100px;
}
.btn11hover:hover{
	opacity:1;
}
.btn11:after{
	font-size:1em;
	content:"";
	position:absolute;
	top:0px;
	left:36%;
	height: 0px;
}
.btn22{
	background-position:-212px 0;
	transition: opacity .3s ease;
	opacity:1;
	position:absolute;
	left: 0;
}
.btn22:hover{
	opacity:0;
}
.btn22hover{
	background-position:-315px 0;
	position:absolute;
	transition: opacity .3s ease;
	opacity:0;
	left: 0;
	height:100px;
}
.btn22hover:hover{
	opacity:1;
}
.btn22:after{
	font-size:1em;
	content:"";
	position:absolute;
	top:0px;
	left:19%;
	height: 0px;
}
.btn33{
	background-position:-419px 0;
	transition: opacity .3s ease;
	opacity:1;
	position:absolute;
	left: 0;
}
.btn33:hover{
	opacity:0;
}
.btn33hover{
	background-position:-522px 0;
	position:absolute;
	transition: opacity .3s ease;
	opacity:0;
	left: 0;
	height:100px;
}
.btn33hover:hover{
	opacity:1;
}
.btn33:after{
	font-size:1em;
	content:"";
	position:absolute;
	top:0px;
	left:19%;
	height: 0px;
}
.btn44{
	background-position:-627px 0;
	transition: opacity .3s ease;
	opacity:1;
	position:absolute;
	left: 0;
}
.btn44:hover{
	opacity:0;
}
.btn44hover{
	background-position:-730px 0;
	position:absolute;
	transition: opacity .3s ease;
	opacity:0;
	left: 0;
	height:100px;
}
.btn44hover:hover{
	opacity:1;
}
.btn44:after{
	font-size:1em;
	content:"";
	position:absolute;
	top:0px;
	left:24%;
    height: 0px;
}
.btn55{
	background-position:-833px 0;
	transition: opacity .3s ease;
	opacity:1;
	position:absolute;
	left: 0;
}
.btn55:hover{
	opacity:0;
}
.btn55hover{
	background-position:-937px 0;
	position:absolute;
	transition: opacity .3s ease;
	opacity:0;
	left: 0;
	height:100px;
}
.btn55hover:hover{
	opacity:1;
}
.btn55:after{
	content:"";
	font-size:1em;
	position:absolute;
	top:0px;
	left:8%;
	height: 0px;
}
.btn66{
	background-position:-1041px 0;
	transition: opacity .3s ease;
	opacity:1;
	position:absolute;
	left: 0;
}
.btn66:hover{
	opacity:0;
}
.btn66hover{
	background-position:-1145px 0;
	position:absolute;
	transition: opacity .3s ease;
	opacity:0;
	left: 0;
}
.btn66hover:hover{
	opacity:1;
}
.btn66hover:after{
	font-size:.8em;
	content:"運輸";
	position:absolute;
	top:50px;
	left:35%;
}
.btn77{
	background-position:-1247px 0;
	transition: opacity .3s ease;
	opacity:1;
	position:absolute;
	left: 0;
}
.btn77:hover{
	opacity:0;
}
.btn77hover{
	background-position:-1351px 0;
	position:absolute;
	transition: opacity .3s ease;
	opacity:0;
	left: 0;
}
.btn77hover:hover{
	opacity:1;
}
.btn77hover:after{
	font-size:.8em;
	content:"加值服務";
	position:absolute;
	top:50px;
	left:20%;
}
#logo{
	margin-top:0.5em;
	float:left;
}
#logo img{
	margin: 3% 0;
}
a{
	color:#000000;
	font-size:16px;
	text-decoration:none;
}
p{
	
	font-size:.95em;
	color:#000000;
	line-height:1.4em;
}
p a{
	
	font-size:18px;
	color:blue;
	line-height:1.5em;
	text-decoration:none;
}
em{
	color:#ff0000;
	font-size:1em;
}
h5{
    color: #00612E;
    font-size: 1.3em;
    font-weight: bold;
    letter-spacing: .1em;
    float: left;
}
.indexMore a{
    position: absolute;
    right: 5%;
    bottom: 5%;
    font-weight: bold;
    color: #00612E;
}
.indexMore a:hover{
	color: #00933F;
}
.circle{
	border-radius: 100%;
    width: 1.4em;
    height: 1.4em;
    background: #00612E;
    float: left;
    position: relative; 
}
.circle:after{
	content: "";
    position: absolute;
    right: 22%;
    top: 25%;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-left: 10px solid white;
    border-bottom: 5px solid transparent;
}

#mobile{
	display:none;
}
#mobile a{
	color:#4D4D4D;
	font-size:18px;
	letter-spacing:2px;
	line-height: 31px;
}
.mobileTop{
	margin-top:2px;
}
#wrapper{
    min-height: 100%;
    position: relative;
}
#indexBg{
    min-height: 100%;
    position: relative;
    background-image: url(images/index_bg.jpg);
    background-position: center;
}

.item{
	width:auto;
	height:39px;
	padding:15px 0 0 0;
	background-color: rgba(215, 234, 184, 0.95);
    cursor:pointer;
    text-align:center;
    border: 1px #FFFFFF dotted;
    transition: all .2s ease;
    max-width: 100%;
}
.item:hover{
    background-color: rgba(231, 245, 208, 0.95);
}
.aa_item{
	position:absolute;
	left:0px; 
	cursor:pointer;
	z-index: 9999;
}
#banner{
	max-width:100%;
	text-align:center;
	margin:0 auto;
	padding-top: 93px;
}
#content{
	margin:0 auto;
	overflow: hidden;
}
#navlist_mobile{
	display:none;
	background-color: #3D3D3D;
}
footer ul{
	box-sizing: border-box;
	padding-left:30px;
}
footer ul li{
	background: url(images/icon_mobile.png) no-repeat left;
	border-bottom:1px #000000 dashed;
	height:55px;
	box-sizing: border-box;
	padding:20px 0 0 30px;
}
footer ul li a{
	color:#FFFFFF;
}
#content_right{
	padding-top: 75px;
	padding-bottom: 40px;
}
#navlist ul li{
  	background:url(images/icon.png) no-repeat left;
 	padding:0 0 0 20px;
}
footer{
	background-color:#47513B;
	width:100%;
	position: absolute;
    /*bottom: 0;*/
    background-image: url(images/footer_bg.jpg);
}
#keyBg{
	background-color:#d3d3d3;
	height:100%;
	width:100%;
}

#foot{
	width:100%;
	color:#ececec;
	line-height:1.4em;
	font-size:0.8em;
}

#foot p{font-size:14px; color:#ffffff;}

#foot a{
	color:#ffd700;
	transition:all 0.5s ease;
	font-size:14px;
}
#foot a:hover{color:#a4e68f;}

.footbox{width:1065px; margin:5px auto 25px;}

.footTxLt{display:inline-block;}

.footTxRt{
	padding-left:30px;
    display:inline-block;
    letter-spacing:0.08em;
}
.footTx{display:inline-block;}

.qrcode{
	margin-top:2px;
	display:inline-block;
	vertical-align:top;
	padding-left:15px;
}

.qrcode img{width:80px; height:80px;}

.footTx-S{display:none;}

.copyright{font-size:8px;}

.hot{
	height:auto;
	margin:0 auto;
	float:left;
	width: 1200px;
}
.about{
    font-size: 1.7em;
    padding-top: 5%;
    letter-spacing: .1em;

    color: #0080CE;

    animation:fadeIn .4s ease-in-out 1;
}
hr{
	color: #22ACFF;
    height: 2px;
    background-color: #22ACFF;
    border: 0px;
}
.fadeinContent{

}
/*BG*/
.bg{
    position: fixed;
    background-attachment: scroll;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-size: 100% auto;
    background-position: center;
    z-index: -1;
}
#aboutBg{
	background-image: url(images/about_bg.jpg);
	background-position: center 60px;
}
#newsBg{
	background-image: url(images/news_bg.jpg);
	background-position: center center;
}
#fiberBg{
	background-image: url(images/fiber_bg.jpg);
}
#logisticBg{
	background-image: url(images/logistic_bg.jpg);
}
#inquireBg{
	background-image: url(images/inquire_bg.jpg);
}
#contactBg{
	background-image: url(images/contact_bg.jpg);
}
/*index*/
#index_margin{
	width:1200px;
	margin:0 auto;
}
.indexBox{
	width:1170px; 
	margin:0 auto; 
	padding: 0% 0 3% 0;

}
@keyframes fade{
	0%{opacity:0;}
	100%{opacity:1;}
}
.index4Box{
	width:265px; 
	height:300px; 
	background:#EAEAEA; 
	margin:2% 1%; 
	display: inline-table; 
	border-top: #22ACFF 8px solid;
	box-shadow: 2px 3px 3px rgba(0,0,0,.5);
	position:relative;
}
.BoxAbout{
	background-image:url(images/about1.png);
	width:100%;
	height:100px;
	background-size:auto 100%;
    background-position: center center;
    transition:all .3s ease;
}
.BoxAbout:hover{
	-webkit-filter: saturate(3);
	filter: saturate(3);
}
.BoxText{
    line-height: 1.5em;
    margin: 3% 5%;
    font-size: .95em;
}
.BoxNews{
	background-image:url(images/indexNews.jpg);
	width:100%;
	height:100px;
	background-size:auto 100%;
    background-position: -50px;
    transition:all .3s ease;
}
.BoxNews:hover{
	-webkit-filter: saturate(3);
	filter: saturate(3);
}
.BoxFiber{
	background-image:url(images/indexFiber.jpg);
	width:100%;
	height:100px;
	background-size:auto 100% ;
    background-position: center center;
    transition:all .3s ease;
}
.BoxFiber:hover{
	-webkit-filter: saturate(3);
	filter: saturate(3);
}
.BoxLogistic{
	background-image:url(images/indexLogistic.jpg);
	width:100%;
	height:100px;
	background-size:auto 100% ;
    background-position: right center;
    transition:all .3s ease;
}
.BoxLogistic:hover{
	-webkit-filter: saturate(3);
	filter: saturate(3);
}
.table{
	padding: 0 0 30px 30px;
}
.newtable1{
	height:100%; 
	line-height:33px;	
}
.newtable2{
	height:100%; 
	line-height:34px;	
}
.date{
	color:#00612E;
	font-size:1em;
	padding: 0 0 0 60px;
	font-family:Arial, Helvetica, sans-serif;
	float:left;
  	width: 15%;
  	vertical-align: top;
}
.news{
	color:#323232;
	display: inline-block;
 	width: 75%;
}
.news a{
	color:#323232;
	font-size:1em;
}
.news a:hover{
	color:#00933F;
}
.news2{
	color:#323232;
	font-size:1em;
	padding-left:230px;
}
.page{
	width:255px;
	margin:50px auto;
	font-family:Arial, Helvetica, sans-serif;
	text-align: center;
}
.page a{
	color:#000000;
	font-size:16px;
	text-decoration:none;
	padding:8px 13px;
}
.page a:hover{
	background-color:#00933F;
	color:#FFFFFF;
	font-size:16px;
	text-decoration:none;
}
.spanpage a{
	background-color:#00612E;
	color:#FFFFFF;
}
.blue{
	color:#0087D8;
	line-height:1.4em;
	font-weight:bold;
}
.red{
	color: #0087D8;
	line-height:1.4em;
	font-weight:bold;
	font-size:1.2em;
}
.about_margin{
	margin:0 auto;
	width:1000px;
}

/*news*/
.news_margin{
	margin:0 auto;
	width:1000px;
}
.news_t{
	color:#00933F;
	font-size:1.2em;
	font-weight:bold;
}
.news_img{
	float:left;
	margin-right:10px;
}
hr{
	width:100%;	
}
.back{
	color:#00612E;
	float:right;
}
h1{
	color:#00612E;
	font-size: 1.6em;
	font-weight:bold;
	line-height:3em;
	letter-spacing:.2em;
}
h2{
	color:#000000;
	font-size:1.3em;
	line-height:2em;
	padding-bottom: 10%;
}
/*contact*/
.contact_margin{
	margin:0 auto;
	width:1000px;
}
.contact_margin iframe{
	width:100%;
	height:300px;
    padding: 5px;
    display: inline-block;
}
.contact_margin p{
	float: none;
    display: inline-block;
    width: 45%;
    margin-right: 10px;
}
.newsBox{
	background: url(images/arches.png);
}
.indexAboutBox img{
	width:50%;
	float:left;
}
.indexAboutText{
	width:50%;
	float:left;
	padding: 5% 5% 0 5%;
    box-sizing: border-box;
}
#indexfootimg{
	float:left;
	height:230px;
	position: relative;
}
.indexfoottext{
    color: #FFFFFF;
    font-size: 2.25em;
    text-align: center;
    position: absolute;
    top: 45%;
    left: 35%;
    letter-spacing: .3em;
}
input[type="text"]{
    background-color: #ffffff;
    border: 1px solid #cccccc;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border linear .2s, box-shadow linear .2s;
    -moz-transition: border linear .2s, box-shadow linear .2s;
    -o-transition: border linear .2s, box-shadow linear .2s;
    transition: border linear .2s, box-shadow linear .2s;
    width: 100%;
}
.contactBox{
	width:420px;
	height: 450px;
	display: inline-block;
    padding: 1%;
    vertical-align: top;
}
.contactBoxContent{
	width:100%;
	padding: 1% 0;
	float: left;
}

textarea{
	width:100%;
}
select{
	width:100%;
}
.contactTx{
	padding: 5px;
    display: inline-block;
    vertical-align: top;
    word-wrap: break-word;
    width: 45%;
}
.contactTx .contactTitle{
    font-weight: bold;
    letter-spacing: .1em;
    color: #CC1923;
    line-height: 2em;
    font-size: 1.2em;
}
.inquireBg{
	/*background-image:url(images/login.png); */
	width:974px; 
	height:612px;
	padding-top: 10%;
    box-sizing: border-box;
}
.InquireWhiteBg{
	width:487px; 
	height:300px; 
	background:rgba(255,255,255,.6); 
	margin:0 auto;
	padding-top: 5%;
    box-sizing: border-box;
}
.loginBg{
	width:321px;
	height:145px;
	border:#00612E 3px solid;
	border-radius: 20px;
    background: #FFFFFF;
    margin: 0 auto;
}
.InquireWhiteBg p{
	color:#007330;
	font-weight:bold;
	padding-left: 17%;
}
.loginBox{
	width:270px;
    margin: 7% auto 0 auto;
	height:130px;
}
.loginFront{
	width:40%;
	float: left;
}
.loginBack{
	width:60%;
	float: left;
}
.loginBoxContent{
	width:90%;
	float: left;
	margin: 2% 0;
}
.loginBoxContent input{
	font-size:1em;
}
.loginBtn{
    background: #00612E;
    color: #FFFFFF;
    border-radius: 15px;
    width: 50px;
    height: 30px;
}
.loginBtn:hover{
	background: #00933F;
}
.loginBtnBox{
	margin:0 auto;
	width: 120px;
	padding-top: 80px;
}
.inquire_margin{
    width: 974px;
    margin: 0 auto;
}
.erp_margin{
	width:974px;
	margin:0 auto;
}
.erpBoxContent{
	width:50%;
	float:left;
	margin: 1% 0;
}
.erpFront{
	width:30%;
	float:left;
	display:inline-block;
}
.erpBack{
	width:50%;
	float:left;
	display:inline-block;
}
.erpBox{
	margin-left: 10%;
}
.erpBoxBtn{
	width:120px;
	margin:0 auto;
}
.erpBoxBtn input{
    margin-top: 20%;
}
.contactBtn{
	margin-bottom:10%;
}
.whiteBg{
	background: rgba(255,255,255,.92);
    padding: 0 3%;
    margin-top: 5%;
    padding-bottom: 2.5%;
}
.whiteBg a{
	font-size:16px;
	color:#22ACFF;
	transition: color .2s ease;
}
.whiteBg a:hover{
	color:#D85E22;
}
.serviceBox{
padding:20px 30px 30px 30px; background:#fff;
}
.serviceBtn img{
max-width:100%; padding:10px 0;
}
.serviceBtnTitle{
font-size:2em; line-height:2em;
color:#000000;
}
.serviceBtnTitleS{
font-size:1.2em; line-height:2em;
}
.footLogo{
    display: inline-block;
    vertical-align:middle;
}
.follow{
    display: inline-block;
    padding-left: 15px;
}
.follow span img{
	vertical-align:middle;
	padding: 0 10px 4px;
}
.fb{
	background-position: -6px 0;
    transition: opacity .3s ease;
}
.fb:hover{
	opacity:.7;
}
.twitter{
	background-position: -6px -35px;
    transition: opacity .3s ease;
}
.twitter:hover{
	opacity:.7;
}
.in{
	background-position: -6px -70px;
    transition: opacity .3s ease;
}
.in:hover{
	opacity:.7;
}
.youtube{
	background-position: -6px -105px;
    transition: opacity .3s ease;
}
.youtube:hover{
	opacity:.7;
}
.ps{
	color:#AD0009;
}
.contactTx img {
    width: 200px;
}
.prodectBox{
	height:250px;
}
.prodectBox img{
	float: left;
    width: 300px;
    padding: 0 10px 0;
}
.footBottom{
	bottom:0px;
}
.towerBox{
	border-bottom: #999999 1px dotted;
	padding: 20px 0 10px;
}
.towerBox img{
	width: 20%;
	display: inline-block;
}
.towerBox div{
	display: inline-block;
	vertical-align:top;
	padding-top:20px;
	width: 75%;
}
.towerBox div a{
	color: #D8222C;
    font-size: 1.2em;
    font-weight:bold;
}
.towerBox div a:hover{
	color: #FF8347;
}

.cannedtowerBox{
	border-bottom: #999999 1px dotted;
	padding: 20px 0 10px;
}
.cannedtowerBox img{
	width: 40%;
	display: inline-block;
}
.cannedtowerBox div{
	display: inline-block;
	vertical-align:top;
	padding-top:20px;
	width: 55%;
}
.cannedtowerBox div a{
	color: #D8222C;
    font-size: 1.2em;
    font-weight:bold;
}
.cannedtowerBox div a:hover{
	color: #FF8347;
}
.formBox .form {
    position: relative;
    margin-bottom: 25px;
}
.b-box {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.formBox .form label {
    display: block;
    background: #C9EAFF;
    font-size: 15px;
    height: 30px;
    line-height: 30px;
    width: 171px;
    padding: 0 10px;
    color: #545454;
    position: absolute;
    font-weight: bold;
    left: 0;
    top: 0;
}
.formBox .form input[type="text"] {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 5px;
    padding-left: 195px;
    width: 100%;
    height: 30px;
    line-height: 30px;
    border: 1px solid #C9EAFF;
    font-size: 1em;
}
input[type="text"] {
    -webkit-appearance: none;
}
.formBox .form textarea {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    height: 100px;
    padding: 5px 5px;
    padding-left: 195px;
    border: 1px solid #ccc;
    font-size: 1em;
    font-family: Arial,微軟正黑體,Microsoft JhengHei,新細明體,sans-serif;
}
.formBox {
    margin-bottom: 25px;
    color: #222;
    font-size: 1em;
    margin-top: 30px;
}
.formBox form .btn a {
    display: inline-block;
    padding: 7px 15px;
    font-size: 16px;
    color: #FFF;
    border-radius: 3px;
    margin: 0 10px;
}
a.btn_color1 {
    background: #2B80CC;
    color: #FFF;
    padding: 5px 10px;
    border-radius: 5px;
    margin: 10px 10px;
    transition: all .4s ease;
    font-weight: bold;
}
a.btn_color1:hover {
    background: #78BFFF;
    color: #FFFFFF;
    padding: 10px 20px;
}
.send{
    text-align: center;
    margin-top: 80px;
}
.number{
	padding-left:195px;
	font-weight:bold;
	display:inline-block;
	padding-top: 3px;
    color: #D0000B;
}
.formPS{
	color: #D8222C;
    padding-left: 10px;
    font-size: .9em;
    display:inline-block;
}
.foot_fb{
	background:url(images/foot_fb.png) no-repeat; 
	height:28px; 
	width:35px; 
	display:inline-block; 
	vertical-align: middle;
	padding: 2px 10px 0;
	transition: all .3s ease;
}
.foot_fb:hover{
	background:url(images/foot_fb2.png) no-repeat; 
	padding-bottom: 6px;
}
.foot_line{
	background:url(images/foot_line.png) no-repeat; 
	height:28px; 
	width:35px; 
	display:inline-block; 
	vertical-align: middle;
    padding: 2px 10px 0;
    transition: all .3s ease;
}
.foot_line:hover{
	background:url(images/foot_line2.png) no-repeat; 
	padding-bottom: 6px;
}
.foot_mail{
	background:url(images/foot_mail.png) no-repeat; 
	height:28px; 
	width:35px; 
	display:inline-block; 
	vertical-align: middle;
    padding: 2px 10px 0;
    transition: all .3s ease;
}
.foot_mail:hover{
	background:url(images/foot_mail2.png) no-repeat; 
	padding-bottom: 6px;
}
@keyframes fadeIn{
	0%{opacity:0; transform:translate(0,-20px);}
	100%{opacity:1; transform:translate(0,0px);}
}
/*螢幕大小*/

@media screen and (max-width: 1600px) { 
	#navlist ul{  width: 900px;margin: 0 auto;}
	#navlist ul li{  display: inline;}
	#content_right{  padding-left: 0; }
}
@media screen and (max-width: 1400px) { 
	.indexAboutText{ padding: 3% 4% 0 5%;}
	.navBox{ width: 85%;}
	.indexBox{width: 1145px;}
	.index4Box{width: 260px;}	
}
@media screen and (max-width: 1300px) { 
	nav ul{padding-right:2%;}
	h1{line-height: 2em;}
	h2{line-height: 1.5em;}
	.navBox{ width: 90%;    height: 65px;}
}
@media screen and (min-width: 1200px){
	#mobile{display:none; visibility:hidden;}
}
@media screen and (max-width: 1200px) { 
	#index_margin{width: 1002px; margin: 0 auto;}
	#footFloat{margin-bottom:15px;}
	.news_margin{  width: 90%;}
	.news {  width: 750px;}
	.date{  padding: 0 0 0 40px;  width: 130px;}
	.hot{width: 1000px;}
	header{height: 75px;}
	nav ul{display:none;}
	#logo{text-align: center; float:none;}
	#aa{background:url(images/aa.png) no-repeat;width:55px;height:35px;margin:15px 0 0 10px;float:left;}
	#logo img{margin:0;}
	.bg{ background-size:  auto; background-position: center top;}
	.indexBox{ width: 1060px;}
	.index4Box {width: 240px;}
	.language{display:none;}
	#banner{    padding-top: 75px;}
}
@media screen and (max-width: 1080px) { 
	#index_margin{  width: 936px;}
	nav ul{padding-right:60px;}
	.date{  padding: 0 0 0 30px;  width: 100px;}
	.news{width: 80%;}
	.hot{  width: 940px;}
	.about_margin{width:90%;}
	.erp_margin{width:90%;}
	.contact_margin{width:90%;    margin-bottom: 10%;}
	.contact_margin p{float:none;}
	h2{font-size: 1.1em;}
	h5{font-size: 1.2em;}
	h1{font-size: 1.4em;}
	#content_right{padding-bottom: 60px;}
	.indexBox{width: 660px;}
	.index4Box{width: 300px; margin: 2% 2%;}
	.indexWrapper{ padding: 5% 0;}
	.footbox{width:100%;}
	.footTxLt{display:block; max-width:550px; margin: 30px auto;}
	.footTxRt{padding-left:0; display:block; max-width:500px; margin:0px auto 30px;}
	.footBottom{bottom:auto;}
}
@media screen and (max-width: 980px) { 
	nav ul{padding-right:50px;}
	.indexAboutBox img {width: 100%; float:none;}
	h2 {padding-bottom: 5%;}
	.indexAboutText {padding: 3% 4% 8% 5%; width: 100%; float:none;}
	.inquire_margin{width:700px;}
	.inquireBg{width:700px; padding-top: 15%;}
}
@media screen and (max-width: 840px) { 
	#content_right{overflow: inherit;}
	#index_margin{width: 720px;}
	.date{  padding: 0 0 0 10px; }
	.news{width: 75%;}
	.hot {width: 100%}
	#keyBg{background-color: #3D3D3D;}
}
@media screen and (max-width: 768px) { 
	#index_margin {width: 680px;}
	.inquire_margin{width:500px;}
	.inquireBg{width:500px; padding-top: 20%;}
	.InquireWhiteBg{width:400px;}
	.erpBoxContent{width:100%;}
	.bg{ background-size: 350% auto;}
	.indexBox{width: 90%; padding-bottom: 5%;}
	.index4Box{width: 100%; margin: 4% 0; height: 300px;}
	.BoxAbout{ height:150px;}
	.BoxNews{ height:150px;background-position: 0;}
	.BoxFiber{ height:150px;}
	.BoxLogistic{ height:150px; }
	.serviceBtnTitle{font-size:1.7em;}
	.serviceBtnTitleS{font-size: 1.1em;}
	.serviceBox{padding:20px 20px 30px 20px;}
	.indexWrapper{padding-bottom: 0;}
	.contact_margin p{ width: 100%;}
	.contactTx{ width: 95%;}
}
@media screen and (max-width:640px){
	#index_margin{width:95%;}
	.news{width:70%; padding:0 0 0 10px;}
	.news_t{float:none;}
	#footFloat{float:none; text-align:center;}
	#content_right{padding-bottom:80px;}
	.towerBox div{width:100%;}
	.towerBox img{width:200px; display:block; margin:0 auto;}
	.cannedtowerBox div{width:100%;}
	.cannedtowerBox img{width:400px; display:block; margin:0 auto;}
	.footbox{width:90%;}
}
@media screen and (max-width: 520px){
	.inquire_margin{width:400px;}
	.inquireBg{width:400px;}
	.InquireWhiteBg{width:300px; height: 220px;}
	.InquireWhiteBg p{padding-left: 8%;}
	.contactBox{width:90%;}
	.loginBoxContent{width: 90%;}
	.loginBg{width:250px;}
	.loginBox{ width: 220px;}
	.loginFront{width:45%;}
	.loginBack{width:55%;}
	#content_right{padding-bottom:100px;}
	.serviceBox{padding:20px 15px 30px 15px;}
	footer{background-size:12%;}
	.footTxLt{max-width:285px; margin:0 auto;}
	.follow{padding-left:0; margin:15px 0;}
	.copyright{margin:5px 0; line-height:1.7em;}
	.footTxRt{width:288px;}
	.footTx{display:none;}
	.footTx-S{display:block;}
	.qrcode{display:block; padding-left:0; margin:15px auto; text-align:center;}
	.qrcode img{width:120px; height:120px;}
	.prodectBox img{float:none; width:95%; padding:0 10px 0;}
	.prodectBox{height:auto;}
	.prodectBox p{width:95%; margin:0 auto;}
}
@media screen and (max-width: 480px) { 
	header{height:69px;}
	.news{width:100%;}
	#aa{  background-size: 80%;margin: 10px 0 0 10px;}
	.mobileTop{margin-top:-7px;}
	.footbox{width:90%;}
	#logo img{ height:55px;}
	#banner{padding-top: 68px;}
	.BoxNews {    background-position: -170px;}
}
@media screen and (max-width: 400px) { 
	.inquire_margin{width:300px;}
	.inquireBg{width:300px; height:500px;}
	.InquireWhiteBg{width:280px;}
	#logo img{width:220px;}
	#icon2{text-align:center;}
	.formBox .form label{    position: initial;}
	.formBox .form input[type="text"]{padding-left: 10px;}
	.number {padding-left: 10px;}
}
@media screen and (max-width: 342px) { 
	.contactTx{font-size: .95em;}
}