@charset "UTF-8";
@import url(http://fonts.googleapis.com/css?family=Judson:400,400italic);
@import url(https://fonts.googleapis.com/css2?family=Nanum+Gothic&family=PT+Sans&display=swap);
/* 尚未開放================================================
$color-dsk-bg: $color-main; //選單背景顏色，預設為網站主配色
$color-dsk-font: #fff; //選單文字顏色，預設為白色
$color-dsk-active: #555;  //按下去的背景色
$color-dsk-border: rgba(255, 255, 255, 0.2); //選單線條顏色

/* main color $color-main */
/*===1===index==============*/

.index { }
.index .slide a { }
.alphaw { filter: alpha; filter: alpha(Opacity=85, Style=0); -moz-opacity: 0.8; opacity: 0.8; }
.index { overflow: hidden;/*position:relative;*/ }
.index .slide a { display: block; overflow: hidden; -webkit-background-size: cover; background-size: cover; background-position: center center; }
.index .slide a .wrap { height: 280px; position: relative }
.index .slide img { display: block; width: auto; height: 100%; }
.index .slick-dots { bottom: 10px; }
.index .fontwrap { z-index: 9; left: 0; bottom: 0; position: absolute; overflow: hidden; padding: 0 0 25px 0; width: 100%; }
.index .fontwrap h2 { font-size: 1.8rem; line-height: 140%; color: #fff; margin: 0 0 3rem 0; padding: 0 5%; display: block; overflow: hidden; width: 60%;font-weight:normal;}
.index .fontwrap h2.dark{ color:#68748E;}
.wrap-fs .slick-slider { margin-bottom: 0; }
.index-quick { overflow: hidden; }
.index-quick .iq-left {background-color: #69758F; /* background-image: url(../img/index/quick01.jpg)*/; background-position: right bottom; padding: 5%; background-repeat: no-repeat; background-size: auto 150px; cursor: pointer }
.index-quick .iq-left h3 { font-size: 1.125rem; color: #fff; clear: left; text-shadow: 1px 1px 3px rgba(150, 150, 150, 1); }
.index-quick .iq-left h4, .index-quick h4 { font-size: 0.8rem; color: #fff; font-weight: 200; clear: left; text-shadow: 1px 1px 3px rgba(150, 150, 150, 1); }
.index-quick .iq-more { font-size: 0.8em; clear: left; margin: 3% 0 0 0; display: inline-block; }
.index-quick .iq-more a { color: #67738D; background: #fff; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding: 2px 10px; display: inline-block; }
.index-quick .iq-more a:hover { background: #5EC1E8; display: inline-block; color: #fff; }
.index-quick .iq-right {background-color: #B0BBD5;  /*background-image: url(../img/index/quick02.jpg); */ background-position: right bottom; padding: 5%; background-repeat: no-repeat; background-size: auto 100px; }
.index-quick .iq-right h3 { color: #fff; text-align: left; clear: left; display: inline-block; font-weight: 200; line-height: 120%; width: 90%; text-shadow: 1px 1px 3px rgba(150, 150, 150, 1); }
.index-quick .iq-right h4 { clear: left; margin: 0; padding-bottom: 1em; width: 50%; text-shadow: 1px 1px 3px rgba(150, 150, 150, 1); }
.index-quick .iq-click { font-size: 0.8em; clear: left; margin-left: 5%; display: inline-block; margin: 0; }
.index-quick .iq-right .iq-click a { color: #fff; background: #5874A3; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding: 2px 25px; display: inline-block; }
.index-quick .iq-right .iq-click a:hover { background: #fff; display: inline-block; color: #5874A3; }
.footer { background: #333; padding: 5%; border-bottom: 1px solid #484848; overflow: hidden; }
.foot-left { }
.foot-left .fl-title { color: #D5D7DA; background: none; padding: 0 0 10px 0; font-size: 0.9375rem; display: block; border-bottom: 1px solid #484848; }
.foot-left .fl-title a { color: #D5D7DA; }
.foot-left ul { margin-bottom: 1em }
.foot-left li { background: url(../img/layout/foot-dot.png) no-repeat left 12px; padding: 3px 0 3px 10px; font-size: 0.8rem; display: none; }
.foot-left li a { color: #999; }
.foot-left li a:hover, .foot-left .fl-title a:hover { color: #5EC1E8; }
.topborder { border-top: 1px solid #484848; }
.foot-right { text-align: right; }
.foot-right .fr-title { color: #6AA3D0; font-size: 1.0625em; }
.foot-right .fr-tel { font-weight: 200; }
.foot-right .fr-tel a { color: #ccc; font-size: 1.25rem; }
.foot-right .fr-mail a { color: #999; font-size: 0.9375rem; }
.foot-right ul.fr-social{ display:none;}
.foot-right ul.fr-social li { display: inline-block; margin: 1em 0 0 0.5em }
.foot-right ul.fr-social li.fb a { background: url(../img/layout/foot-fb.png) no-repeat left top; display: block; width: 46px; height: 46px; filter: alpha; filter: alpha(Opacity=30, Style=0); -moz-opacity: 0.3; opacity: 0.3; text-indent: 9999em; }
.foot-right ul.fr-social li.twitter a { background: url(../img/layout/foot-twitter.png) no-repeat left top; display: block; width: 46px; height: 46px; filter: alpha; filter: alpha(Opacity=30, Style=0); -moz-opacity: 0.3; opacity: 0.3; text-indent: 9999em; }
.foot-right ul.fr-social li.in a { background: url(../img/layout/foot-in.png) no-repeat left top; display: block; width: 46px; height: 46px; filter: alpha; filter: alpha(Opacity=30, Style=0); -moz-opacity: 0.3; opacity: 0.3; text-indent: 9999em; }
.foot-right ul.fr-social li.fb:hover, .foot-right ul.fr-social li.twitter:hover, .foot-right ul.fr-social li.in:hover { filter: alpha; filter: alpha(Opacity=60, Style=0); -moz-opacity: 0.6; opacity: 0.6 }
.footer2 { background: #333; padding: 2% 5% }
.copyright { }
.copyright span { display: inline; }
.copyright .c-co { font-size: 0.8rem; color: #696969; }
.copyright .c-cw { color: #525252; font-size: 0.8rem; }
.copyright .c-cw a { color: #525252; }
/*===2===dr down==============*/

.dr-layout { background: url(../img/dr/dr-layout_s3.jpg) no-repeat center top; height: 235px; overflow: hidden; top: 50px; position: relative; display: block; padding-top: 50px; box-sizing: border-box; }
.dr-layout h2 { color: #fff; font-size: 2.5rem; text-align: center; padding: 0; margin: 0; width: 100%;font-weight: 200;}
.dr-layout h3 { color: #fff; font-size: 1.125rem; text-align: center; padding: 0; margin: 0; width: 100%; font-weight: 200; }
.drlist-sort { }
.ds-title { display: none; }
.drlist-sort ul { display: none; }
.drlist-sort li { float: left; display: block; margin-right: 1em }
.drlist-sort li a { background: #999; padding: 1px 15px; display: block; color: #fff; font-size: 0.9em; }
.drlist-sort li a:hover { padding: 1px 15px; display: block; background: #426297; }
.drlist-sort li.current { border: none; display: block; }
.drlist-sort li.current a { background: #426297; color: #fff; padding: 1px 15px; display: block; }
.drlist-sort select { display: black; }
.dr .wrap { padding: 5%; }
.top-article { margin-top: 1em; background: #78839C; display: block; overflow: hidden; }
.top-article .ta-left { }
.top-article .ta-left img { display: block; width: 100%; height: auto; max-height:500px; }
.top-article .ta-right { padding: 5%}
.top-article .ta-right .date { font-size: 0.9em; color: #fff; }
.top-article .ta-right h3 { font-size: 1.25em; font-weight: normal; color: #fff; }
.top-article .ta-right h3 a { color: #fff; border: none; }
.top-article .ta-right h4 { font-size: 0.9375em; color: #D9DCE4; font-weight: normal; }
.top-article .ta-right h4 a { color: #D9DCE4; }
.top-article .ta-right .more { font-size: 0.9em; background: url(../img/dr/dr-arrow-gl.png) no-repeat 40px center; }
.top-article .ta-right .more a { color: #5EC1E8; }
.top-article .ta-right .more a:hover { color: #fff; background: url(../img/dr/dr-arrow-l.png) no-repeat 40px center; }
.center-article { overflow: hidden; display: block; clear: left; }
.ca-each {overflow: hidden; }
.ca-each ul { display: block; overflow: hidden; border-bottom: 1px solid #ccc; padding: 5% 0; }
.ca-each .ca-pic { width: 30%; float: left; margin: 0 0 0 0; }
.ca-each .ca-pic img { display: block; width: 100%; height: auto; padding: 0; margin: 0 0 0 0; }
.ca-each li { width: 65%; float: left; margin-left:5% }
.ca-each .ca-date { color: #666; font-size: 0.8em; }
.ca-each .ca-date a { color: #666; font-size: 0.8em; }
.ca-each .ca-date:hover, .ca-each h3:hover { color: #5EC1E8; }
.ca-each h3 { font-size: 1rem; font-weight: normal; color: #666; }
.ca-each h4 { font-size: 0.9em; color: #666; font-weight: normal; display: none; }
/*===3===dr down inpage==============*/
.dr-inpage { background: #E6E6E6; overflow: hidden; display: block; padding-top: 50px; }
.dr-inpage .wrap { margin: 10% 5%; overflow: hidden; }
.dr-inpage .di-edit { border-bottom: 1px solid #333; padding-bottom: 1em; margin-bottom: 1em }
.dr-inpage .di-edit .clearrange{ width:100%;}
.dr-inpage .di-edit h3 { font-size: 1.25rem; padding: 0; margin-left:0; width: 100%;font-weight:400; }
.dr-inpage .di-edit h4{ margin-left:0; font-weight:normal;font-size: 1.25rem;}
.dr-inpage .di-edit a.close { background: url(../img/layout/icon-x.png) no-repeat left top; width: 25px; height: 25px; display: block; }
.dr-inpage .di-edit div { font-size: 0.9375rem; }
.dr-inpage .di-edit img {height: auto; display: block; margin: 1em auto; width:100%; }
.dr-inpage .di-social { position: relative; }
.dr-inpage a:hover { filter: alpha; filter: alpha(Opacity=60, Style=0); -moz-opacity: 0.6; opacity: 0.6; }
.dr-inpage .di-social .fb { background: url(../img/layout/icon-fb.png) no-repeat left top; width: 34px; height: 34px; display: inline-block; text-indent: 100%; white-space: nowrap; overflow: hidden; }
.dr-inpage .twitter { background: url(../img/layout/icon-twitter.png) no-repeat left top; width: 34px; height: 34px; display: inline-block; text-indent: 100%; white-space: nowrap; overflow: hidden; }
.dr-inpage .in { background: url(../img/layout/icon-in.png) no-repeat left top; width: 34px; height: 34px; display: inline-block; text-indent: 100%; white-space: nowrap; overflow: hidden; }
.dr-inpage .mail { background: url(../img/layout/icon-mail.png) no-repeat left top; width: 34px; height: 34px; display: inline-block; text-indent: 100%; white-space: nowrap; overflow: hidden; }
.dr-inpage .close { background: url(../img/layout/icon-x.png) no-repeat center center; width: 34px; height: 34px; display: black; float: right; text-indent: 100%; white-space: nowrap; overflow: hidden; }
.dr-inpage .close2 { background: url(../img/layout/icon-x.png) no-repeat center center; width: 34px; height: 34px; display: none; float: right; text-indent: 100%; white-space: nowrap; overflow: hidden; }


.center{ text-align:center;}
.edit50-left{ width:100%; margin:0 0 0 0; padding:0;}
.edit50-right{ width:100%;  margin:0 0 0 0; padding:0;}
.edit60-left{ width:100%; margin:0 0 0 0; padding:0;}
.edit40-right{ width:100%;  margin:0 0 0 0; padding:0;}

.edit30-left{width:100%; margin:0 0 0 0; padding:0;overflow:hidden }

.edit30-left img{width:80%; max-width:170px; }
.edit70-right{  padding:0;width:100%; margin:0 0 0 0;overflow:hidden}

.edit20-left{ margin:0 0 0 0; padding:0;}
.edit80-right{  margin:0 0 0 0; padding:0;}


.editov{ overflow:hidden;}
.editovline{ border-bottom:1px solid #666; padding-bottom:3%; margin-bottom:3%;}
.ie-lastline{border-top:1px solid #666;padding-top:3%; margin-top:3%;}

.droneimg{ width:100%; margin:0 auto; max-width:780px;}
.droneimg img{ width:100%; height:auto; }
.edit50{ width:100%;}
.img50{ width:100%;}

table{border-collapse:collapse;border:0;}
th {font-weight: bold;}
td, th {display: table-cell;vertical-align: inherit;}
.ie_form{ margin:20px 0 0 0}
.ie_form td{ border:1px solid #666; padding:0.5%;font-size:0.75rem;}
.ie_form thead{ background:#333; color:#fff; text-align:center; margin:0 auto;}




/*===3===issue inpage==============*/
.dr-inpage .di-edit h2 { font-size: 2.25rem; padding: 0; margin: 0 0 1em 0; width: 100%; font-weight: 200; text-align: center; }
.formshow{ overflow: inherit; padding:0; margin:0 0 1rem 0; clear:both;}
.di-factory {}
.di-factory ul{}
.di-factory li{ text-align:center;border-top:1px solid #fff; padding-bottom:1rem}
.di-factory li:first-child{ border:none;}
.di-factory .df-pic{ }
.di-factory .df-pic img{ display:block; width:100%; height:auto; max-width:210px;} 

.di-envir{}
.di-envir ul{ overflow:hidden; display:block;}
.di-envir li{} 
.di-envir h4{ margin:0; text-align:center;width:100%;}
.di-envir p{ margin:0;text-align:center; width:100%;}
.di-envir li.di-pic{}
.di-envir li.di-pic img{ width:100%; max-width:230px; height:auto;}
.di-envir li.di-text{}
	.di-envir ul +ul{ margin-top:1.5rem; border-top:1px solid #333; padding-top:1.5rem;}

/*===4===issue list==============*/
.issues-list { background: #1B3A5A url(../img/issue/ovbg.jpg) no-repeat right top; overflow: hidden; display: block; padding-top: 50px; box-sizing: border-box; }
.issues-list .wrap { margin: 10% 5%; }
.issues-list .il-text { margin-bottom: 1em }
.issues-list .il-text h2 { font-weight: normal; color: #fff; font-size: 2.5rem; margin: 0; text-align: center; width: 100%; font-weight:200;}
.issues-list .il-text h3 { color: #fff; font-size: 1.0625rem; font-weight: normal; margin: 1rem 5% 2rem 5%; text-align: center; width: 90%; }
#container { clear: both; background: #fff; }
.issues-list .box { width: 288px; overflow: hidden; padding-bottom: 16px; margin: 0 0 16px 0; background: #fff; display: block; }
.issues-list .box h3 { font-size: 1.25rem; margin-top: 1rem }
.issues-list .box .des { font-size: 0.9375rem; margin: 0 5%; }
.issues-list .box:hover { background: #4778BB; color: #fff; }
.issues-list .pic { padding: 0; margin: 0; width: 100%; }
.issues-list .pic img { display: block; width: 100%; height: auto; }
.issues-list .il-each { width: 100%; overflow: hidden; padding: 0 0 0 0; margin: 0; display: block; }
.masonry-brick { width: 25%; margin-left: -1px; }
.container { }
.il-article { margin: 0 3% 3% 3%; box-sizing: border-box; }
.il-article ul { background: #fff; margin-bottom: 1em; padding-bottom: 1em; color: #333; }
.il-article ul a { color: #333; }
.il-article ul a:hover { color: #fff; }
.il-article ul:hover { background: #4878BB; color: #fff; }
.il-article li { }
.il-article li.ia-pic { }
.il-article li.ia-pic img { display: block; width: 100%; height: auto; margin-bottom: 1em }
.il-article h3 { font-size: 1.25rem;  font-weight:normal; padding:0 5%; width:90%;}
.il-article h4 { font-size: 0.9375rem; font-weight:normal; padding:0 5%; width:90%;}
/*===4===contact ==============*/

.contact-wrap { background-image: url(../img/contact/contactbg_s7.jpg); background-repeat:no-repeat; background-position:center top; background-size:auto 100%;  overflow: hidden; display: block; padding-top: 50px; box-sizing: border-box; min-height:400px;  }
.contact-wrap .wrap { margin: 10% 5%; }
.contact-wrap .il-text { margin-bottom: 1em }
.contact-wrap .il-text h2 { color: #fff; font-size: 2.5rem; margin: 0; text-align: center; width: 100%; font-weight:200; }
.contact-wrap .il-text h3 { color: #fff; font-size: 1.0625rem; font-weight: normal; margin: 1rem 5% 2rem 5%; text-align: center; width: 90%; }
.cw-formwrap { margin: 1rem 0 1rem 0; }
.cw-formwrap li { margin-bottom: 0.5rem; overflow: hidden; display:block; }
.cw-formwrap input { border: none; height: 40px; line-height: 40px; width: 96%; outline: none; padding: 0 1%; color: #333; background: #f2f2f2; /* Old browsers */ background: -moz-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f2f2), color-stop(76%, #ffffff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* IE10+ */ background: linear-gradient(to bottom, #f2f2f2 0%, #ffffff 76%);     /* W3C */  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#ffffff', GradientType=0);
/* IE6-9 */
outline-color: none; float: left; transition: background-color 0.5s; -moz-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; -ms-transition: background-color 0.5s; -o-webkit-transition: background-color 0.5s; border: 1px solid #DBDBDB; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.cw-formwrap select { border: none; height: 42px; line-height: 40px; width: 99%; border: 1px solid #DBDBDB; outline: none; color: #999; padding: 0 0 0 1%; background: #f2f2f2; /* Old browsers */ background: -moz-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f2f2), color-stop(76%, #ffffff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* IE10+ */ background: linear-gradient(to bottom, #f2f2f2 0%, #ffffff 76%);     /* W3C */  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#ffffff', GradientType=0);
/* IE6-9 */
outline-color: none; transition: background-color 0.5s; -moz-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; -ms-transition: background-color 0.5s; -o-webkit-transition: background-color 0.5s; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.cw-formwrap li option { color: #333; line-height: 40px; }
.cw-formwrap textarea { border: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background: #f2f2f2; /* Old browsers */ background: -moz-linear-gradient(top, #f2f2f2 0%, #ffffff 24%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f2f2), color-stop(24%, #ffffff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f2f2f2 0%, #ffffff 24%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f2f2f2 0%, #ffffff 24%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f2f2f2 0%, #ffffff 24%); /* IE10+ */ background: linear-gradient(to bottom, #f2f2f2 0%, #ffffff 24%);     /* W3C */  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#ffffff', GradientType=0);
/* IE6-9 */
height: 100px; line-height: 20px; outline: none; padding: 0; width: 97%; padding: 1%; color: #333; outline-color: none; transition: background-color 0.5s; -moz-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; -ms-transition: background-color 0.5s; -o-webkit-transition: background-color 0.5s; border: 1px solid #DBDBDB; }
.cw-formwrap select:focus, ul li textarea:focus, input:focus,.tracedown .searchwrap input:focus { background: rgba(197, 235, 245, 1); color: #0093EA; }
.cw-formwrap .send { background:#13AAEB;width: 96%; padding: 0.5em 0; text-align: center; display: block; margin: 1em 0; color: #fff; font-size: 15px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; clear: both; }
.cw-formwrap .send:hover {filter: alpha; filter: alpha(Opacity=80, Style=0); -moz-opacity: 0.8; opacity: 0.8}
.contact-wrap .home{background:#13AAEB;width: 97%; padding: 0.5em 0; text-align: center; display: block; margin: 1em 0; color: #fff; font-size: 15px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; clear: both;}
.contact-wrap .home:hover{filter: alpha; filter: alpha(Opacity=80, Style=0); -moz-opacity: 0.8; opacity: 0.8} 

/*===5===tracedown ==============*/
.tracedown { background: url(../img/traceable/trace-bg.jpg) repeat center 50px; overflow: hidden; display: block; padding-top: 50px; box-sizing: border-box; }
.tracedown .wrap { margin: 10% 5%; }
.tracedown .il-text { margin-bottom: 1em; }
.tracedown .il-text h2 { font-weight: 200; color: #333; font-size: 2.5rem; margin: 0; text-align: center; width: 100%;line-height: 110%; }
.tracedown .il-text h3 { color: #333; font-size: 1.0625rem; font-weight: normal; margin: 1rem 5% 2rem 5%; text-align: center; width: 90%; }

.tracedown .searchwrap{ border:1px solid #ccc; background:#fff;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding:5% 10%;  }
.tracedown .searchwrap ul{}
.tracedown .searchwrap li{ margin-bottom:0.5em; overflow:hidden;}
.tracedown .searchwrap input{ border: none; height: 40px; line-height: 40px; width: 95%; outline: none; padding: 0 2%; color: #333; background: #f2f2f2; /* Old browsers */ background: -moz-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f2f2), color-stop(76%, #ffffff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f2f2f2 0%, #ffffff 76%); /* IE10+ */ background: linear-gradient(to bottom, #f2f2f2 0%, #ffffff 76%);     /* W3C */  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#ffffff', GradientType=0);
/* IE6-9 */
outline-color: none; float: left; transition: background-color 0.5s; -moz-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; -ms-transition: background-color 0.5s; -o-webkit-transition: background-color 0.5s; border: 1px solid #DBDBDB; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}

.tracedown .searchwrap .search-font{ background:url(../img/traceable/trace-arrowd.png) no-repeat left center; font-size:1.1875rem; padding-left:25px; }
.tracedown .searchwrap .go{background:#4878BB;padding: 0.5em 0; text-align: center; display: block; color: #fff; font-size: 15px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; clear: both; }
.tracedown .searchwrap .go a{ color:#fff;}
.tracedown .searchwrap .go:hover{ background:#13AAEB;/*filter: alpha; filter: alpha(Opacity=60, Style=0); -moz-opacity: 0.6; opacity: 0.6*/}
.tracedown div.flowpic{ display:none; }
.tracedown div.flowpic img{ width:100%; height:auto;}

/*===5===tracedown detail==============*/
.trace-detail{padding-top: 50px; box-sizing: border-box; overflow: hidden; display: block; }
.trace-detail .wrap { margin:5%; overflow:hidden;}

.td-newlot{text-align:center;}
.td-newlot h2{ font-weight:normal; text-align:center; font-size:1.5em; margin-bottom:5%;}
.td-newlot .picwrap{  width:90%; text-align:center;}

.td-newlot .picwrap span{ display:inline;}
.td-zero{}

.none{ display:none;}

.td-first{ /*border-bottom:1px solid #e5e5e5; */padding:1em 0; margin-bottom:1em;overflow:hidden;}

.td-first .td-bpic{}
.td-first .td-bpic img{ display:block; width:100%; height:auto; max-width:530px; margin:0 auto;}
.td-first .td-info{}
.td-first .td-info .top{ border-bottom:1px solid #e5e5e5; padding-bottom:0.5em; margin-bottom:0.5em; text-align:center;}
.td-first .td-info .spic{ display:none; max-width:530px; max-height:530px;}

.td-first .td-info h3{ color:#333; font-size:1.625rem;font-weight:200; }
.td-first .td-info h3{font-family: 'PT Sans', sans-serif;}
.td-first .td-info h4{font-size:1.1875rem; color:#4678B9;}
.td-first .desinfo{}
.td-first .desinfo .feather{padding:0; margin:0;font-size:1.125rem;}
.td-first .desinfo li{ background:url(../img/traceable/trace-dot.png) no-repeat left 8px; font-size:0.9375rem; padding-left:1rem;}


.td-second{text-align:center;padding:2% 0 2% 0; overflow: hidden;}
.td-second h2{color:#4678B9;font-weight:200;font-size:1.875rem; margin-bottom:2rem; font-weight:400}
.td-second h3{ margin-left:0;padding:0; width:100%;font-weight:200;font-size:1.75rem;}
.td-second .ts-left{ margin-bottom:2em}
.td-second .ts-left .dockpic{ }
.td-second .ts-left .dockpic img{ display:block; width:100%; height:auto; max-width:110px; text-align:center; margin:0 auto;}
.td-second .ts-left ul{ }
.td-second .ts-left li.title{font-size:1.25rem;font-weight:200;}
.td-second .ts-left li.des{ font-size:0.9375rem;}
.td-second .ts-right{}


.td-third{ text-align:center; padding:0 0 0 0;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e6e6e6+0,efefef+100 */
background: #e6e6e6; /* Old browsers */
background: -moz-linear-gradient(left,  #e6e6e6 0%, #efefef 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #e6e6e6 0%,#efefef 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #e6e6e6 0%,#efefef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6e6e6', endColorstr='#efefef',GradientType=1 ); /* IE6-9 */




}
.td-third h3{font-weight:200; position:relative; top:15px; line-height:120%; z-index:999;font-size:1.75rem;}
.tt-mapwrap{ overflow:hidden;position:relative;}

.tt-mapwrap .map01{ float:left; width:34.375%}
.tt-mapwrap .map01 img{ width:100%; height:auto; display:block}
.tt-mapwrap .map02{float:left; width:28.125%}
.tt-mapwrap .map02 img{ width:100%; height:auto;display:block}
.tt-mapwrap .map03{float:left; width:37.5%;}
.tt-mapwrap .map03 img{ width:100%; height:auto;display:block}

.map01show{ display:none;}
/*JOHN*/

.map-detail div { display:none; position:absolute; left:0; bottom:0}
.map-detail div img { display:block; width:100%; height:auto;}


.td-forth{ text-align:center; padding:5% 0 5% 0;background:#F6F6F6;}
.td-forth div{ overflow:hidden; display:block; margin-bottom:10%;}
.td-forth div:last-child{margin-bottom:0;}
.td-forth h2{ line-height:120%;font-size:2rem; font-weight:200;}
.td-forth .tf-pic{ }
.td-forth .tf-pic img{ display:block; width:auto; max-height:260px; margin:2% auto;}
.td-forth .des{font-size:0.9375rem;}

.td-fifth{ background:#EFEFEF;padding:3% 0;text-align:center;}
.td-fifth .wrap{padding:0 0 0 0; margin:0 5%}

.td-fifth h2{line-height:120%;font-size:1.625rem; font-weight:200;}
.td-fifth .tf-clean{ width:90%; margin:0 auto}
.td-fifth .tf-clean ul{ overflow:hidden; padding:2% 0}
.td-fifth .tf-clean ul.btmline{ background:url(../img/traceable/cleanline.png) repeat-x left bottom;}
.td-fifth .tf-clean li.left{ text-align:left; float:left;font-size:0.9375rem;}
.td-fifth .tf-clean li.right{ text-align:right; float:right;font-size:0.9375rem;}


.td-sixth{padding:5% 0; }
.td-sixth h2{ line-height:120%;font-size:2rem; font-weight:200; text-align:center;}
.td-sixth .des{font-size:0.9375rem; text-align:center; margin-bottom:2em}
.td-sixth .ts-no{font-size:1.25rem; color:#4678B9;text-align:center; font-weight:bold;}
.td-sixth li{ overflow:hidden; display:block; background:url(../img/traceable/cleanline.png) repeat-x left bottom; margin:0 5%; padding:5% 0; font-size:0.9375rem; width:90%;}
.td-sixth li:last-child{ background:none;}
.td-sixth .left{ text-align:left; float:left; width:70%; margin:0;}
.td-sixth .right{ text-align:right; float:right;width:30%;margin:0;}

/*===6===about==============*/

.about01{ background-image:url(../img/about/about-101.jpg); background-position: center top; background-repeat:no-repeat; background-size:cover; background-color:#F0F0F0;padding-top: 80px; box-sizing: border-box; overflow: hidden; display: block; padding-bottom:5%}
.about01 h2{font-weight: 300; color: #333; font-size:2rem;text-align: center; line-height: 110%; width:80%; margin:0 10%; }
.about-sspic{ display:inline; padding-left:10px}
.about01 .feather{ width:80%; margin:0 auto; text-align:center; }
.about01 .feather img{ width:100%; height:auto; max-width:520px;margin:0 auto;}
.aicon{ display:none;}


.about01 ul{ margin:0 0% 0 15%;}
.about01 li{ overflow:hidden; display:block;cursor: pointer; }
.about01 li:hover{cursor:hand;}
.about01 .apic{ width:15%;float:left; margin-right:5%;}
.about01 .apic img{ width:100%; height:auto; display:block;}
.about01 h3{ width:80%; float:left; font-size:1.125rem; color:#181818; font-weight:normal;}

.about02{ background-image:url(../img/about/about-201.jpg);background-position: center bottom; background-repeat:no-repeat; background-size:cover; padding:5% 0}
.wa-wrap{ padding:0 5%;}
.about02 h2{ font-weight:normal;font-size:1.625rem;}



.about03{padding:5% 0}
.about03 h2{font-weight:normal;font-size:1.625rem; }
.about03 .a3pic{text-align:center; margin:0 auto; clear:both}
.about03 .a3pic img{width:100%; height:auto; display:block; max-width:610px;margin:0 auto;}


.about04{ background-color:#8291B0; padding:5% 0; width:100%; height:auto; color:#fff;}
.about04 h2{font-weight:normal;font-size:1.625rem;}
.about04 .a4pic img{width:100%; height:auto; display:block;margin:0 auto; max-width:1080px;}
.a4pic{ width:90%;}

.about05{padding:5% 0}
.about05 h2{font-weight:normal;font-size:1.625rem;}
.about05 .a5pic{ width:90%;}
.about05 .a5pic img{width:90%; height:auto; display:block; max-width:580px;margin:0 auto;}

.about06{padding:5% 0 0 0; background-image:none;background-position: left bottom; background-repeat:no-repeat; background-size:cover; background-color:#EBEBEB; }
.about06 h2{font-weight:normal;font-size:1.625rem;}
.about06 .a6pic{ padding:0 0 0 0;margin:0 auto;}
.about06 .a6pic img{width:100%; height:auto; display:block; max-width:580px;margin:0 auto;}



#scroll-top {}
.scroll-top{position:fixed;bottom:0;right:0px;z-index:10;display:none; z-index:9999;}
.scroll-top a{width:70px;display:block;text-align:center;font:11px/100% Arial, Helvetica, sans-serif;text-transform:uppercase;text-decoration:none;color:#bbb;-webkit-transition:1s;-moz-transition:1s;transition:1s;}
.scroll-top a:hover{color:#000;}
.scroll-top span{width:70px;height:70px;display:block;background: url(../img/layout/scroll-top.png) no-repeat center center;-webkit-transition:1s;-moz-transition:1s;transition:1s;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter: alpha(opacity=70);-moz-opacity: 0.7;-khtml-opacity: 0.7;opacity: 0.7;}
.scroll-top span:hover{filter: alpha(opacity=100);-moz-opacity: 1;-khtml-opacity: 1;opacity:1;}

.errow-bg{ background:#5A87C5;
}
.errow-wrap{ width:50%; margin:10% auto 0 auto;}
.errow-wrap .under{ background:url(../img/index/under.png) no-repeat center center; margin-bottom:1em; width:260px; height:260px; display:block; margin:0 auto; opacity:0.8;}
.errow-wrap h2{ font-size:60px; font-family:Arial; font-weight:normal; line-height:120%;  color:#fff; text-align:center; padding:0; margin:0 0 0.5em 0;}
.errow-wrap h3{ font-size:24px; font-family:Arial; font-weight:normal;color:#fff;text-align:center}
.errow-wrap .backhome{ padding:0.5em 2em; color:#fff; text-align:center;display:inherit;-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;}
.errow-wrap .backhome a{  background:#5EC1E8; color:#fff;padding:0.5em 2em;-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; text-decoration:none;}
.errow-wrap .backhome a:hover{background:#fff; color:#5EC1E8;padding:0.5em 2em;-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;}

/*基本手機寫外面*/
@media (min-width: 480px) {
/*平板直式*/

.td-newlot h2{ font-size:1.75rem;}
.scroll-top{ bottom:5px;}

.ie_form td{ padding:1%;font-size:0.8rem;}
.dr-inpage .close2 { display: block; }
.dr-inpage .close{ display: block; position:absolute; top:0; right:0;}

.about01{ width:100%; height:auto;}
.about01 ul{ margin:0 0% 0 10%;}
.about01 li{ width:50%; float:left;}
.about01 .apic{ width:15%;float:left; margin-right:5%}
.about01 h2{ width:60%; margin:0 auto; font-size:2.5rem;}
.about01 h3{width:80%; }


.index .slide a .wrap { height: 350px; position: relative }
.dr-inpage .di-edit h3 { font-size: 1.375rem; }
.ca-each h4 { display: block; }
.issues-list .il-each { width: 50%; float: left; }
.issues-list .wrap { }
.issues-list .box { width: 50%; overflow: hidden; margin: 0; }
.issues-list .box h3 { }
.issues-list .box .des { font-size: 0.9375rem; }
.issues-list .pic { padding: 0; margin: 0; width: 100%; }
.issues-list .pic img { display: block; width: 100%; height: auto; }
.tracedown .searchwrap{ margin:0 10%}
.tracedown div.flowpic{ display:block;margin:2% 10% }
.contact-wrap .home{ width:200px; margin:0 auto;}


}

@media (min-width: 620px) {

	
	.scroll-top{ bottom:-10px;}
.di-envir li.di-pic{ width:30%; float:left; margin-right:5%;}
.di-envir li.di-pic img{ margin:0 0 0 0;}
.di-envir li.di-text{width:65%; float:right;}
	.di-envir li.di-text p{ text-align:left;}
	.di-envir li.di-text h4{ text-align:left;}
	
	
	.di-factory{ overflow:hidden;}
	.di-factory li{ border-top:none; width:50%; float:left;}
.di-factory li:first-child{ border:none;}
.di-factory .df-pic{ }

	
	
.edit30-left{width:27.5%; margin:0 2.5% 0 0; padding:0; float:left; display:block;}

.edit30-left img{width:100%;max-width:170px; }
.edit70-right{  padding:0;width:70%; margin:0 0 0 0;float:right;display:block;}


.about02 .wa-wrap{ /*width:75%; */margin:0 3% 0 22%;}
.about03,.about04{ text-align:center;}


.td-sixth li{padding:3% 0; margin:0 auto; width:60%;}
.td-fifth .tf-clean{ width:60%;}
}

@media (min-width: 680px) {
/*平板直式*/

.td-newlot h2{ display:inline; text-align:left; width:auto; margin-right:5%; line-height:120px;}
.td-newlot .picwrap{ width:auto; }
.il-article h3{ padding:0; }
	.di-factory li{ border-top:none; width:25%; float:left;}
.ie_form td{ padding:10px;font-size:0.8rem;}
.di-envir li.di-pic{ width:37%; float:left; margin-right:3%;}
.di-envir li.di-pic img{ margin:0 0 0 0;}
.di-envir li.di-text{width:60%; float:right;}



.about01{ padding-top:130px;}
.about01 h2{ width:40%; }
.about01 ul{ overflow:hidden; display: inline-block; margin:0 5%; padding:0; width:90%;clear:both;}
.about01 li{ overflow:hidden; display:inline-block; width:20%;text-align:center; margin:0 auto; }

.about01 .apic{ width:80%;float: none; margin-bottom:5%; padding:0 0 0 0;text-align:center; display:block;}
.about01 .apic img{ height:auto; display:block; max-width:90px;float:none;text-align:center; clear:both;}
.about01 h3{width:100%; float:none; text-align:center; font-size:0.9375rem;   line-height:120%; margin:5% 0 0 0}






.contact-wrap .wrap { margin: 0; padding-top:60px; }
.contact-wrap .il-text h3{ margin:1rem 5% 2rem 5%; width:90%;}


.cw-formwrap { margin: 0 auto 3em auto; width: 80%; }
.cw-formwrap li { margin-bottom: 1em; overflow: hidden; width: 48%; float: left; }
.cw-formwrap li:nth-child(2n+1) { margin-right: 1% }
.cw-formwrap li:nth-child(2n+2) { margin-left: 1% }
.cw-formwrap li:nth-child(5) { width: 98%; }
.cw-formwrap li:nth-child(6) { margin: 0 0 1em 0; }




.issues-list .wrap { margin: 10% 5%; }
.issues-list { display: block; overflow: hidden; }
.foot-left { float: left; width: 70%; }
.foot-right { float: right; width: 30%; }
.index-quick .iq-left { width: 50%; float: left; padding: 5% 5% 5% 5%; margin: 0; display: block; height: 195px; background-size: auto 200px; }
.index-quick .iq-left h3, .index-quick .iq-left h4 { padding: 0; margin: 0; }
.index-quick .iq-more { margin-left: 0; }
.index-quick .iq-right { width: 30%; display: block; height: 195px; background-image: right bottom; float: left; padding: 5%; overflow: hidden; background-size: auto 120px; }
.index-quick .iq-right h3, .index-quick .iq-right h4 { width: 100%; }
.index .slide a .wrap { height: 430px; position: relative }
}

@media (min-width: 750px) {
/*	.issues-list .box{ width:345px;}*/
	
}

@media (min-width: 860px) {
/*平板橫式*/
.td-newlot{text-align:center; margin-bottom:30px; overflow:hidden;}
.td-newlot h2{ display:inline-block; width:50%; float:left; margin:0; text-align:right; font-size:2rem;}
.td-newlot h2.onlyone{ width:100%; text-align:center;}
.td-newlot .picwrap{  width:45%;float:left; margin-left:5%;text-align:left;}
.di-envir li.di-pic{ width:24%; float:left; margin-right:3%;}
.di-envir li.di-pic img{ margin:0 0 0 0;}
.di-envir li.di-text{width:73%; float:right;}


.droneimg{ width:100%; margin:0 auto;}
.droneimg img{ width:100%; height:auto; max-width:780px;}
.edit50-left{ width:45%; float:left; margin-right:5%;}
.edit50-right{ width:45%; float:right; margin-left:5%;}

.edit50-left img,.edit50-right img{ display:block; width:80%; height:auto;}

.edit60-left{ width:57.5%; float:left; margin-right:2.5%;}
.edit40-right{ width:37.5%; float:right; margin-left:2.5%;}

.edit30-left{ width:27.5%; margin-right:2.5%; padding:0;overflow:hidden; display:block;}

.edit30-left img{ }
.edit70-right{ width:67.5%;  margin-left:2.5%; padding:0;overflow:hidden;display:block;}

.edit20-left{ width:17.5%;margin-right:2.5%; padding:0;float:left; }
.edit80-right{ width:77.5%;  margin-left:2.5%; padding:0;float:right;}



.about01 ul{}
.about01 li{ float:left; width:20%;}
.about01 .apic{ padding:0 0 0 0; margin:0 auto 0 auto; clear:both; text-align:center; width:auto;}
.about01 .apic img{ clear:both; margin:0 auto 0 auto;}
.aicon{ display: inline-block; margin-right:10px;}

.about02 .wa-wrap{ width:57%; margin:0 3% 0 3%; float:right;}
.about02 h2,.about03 h2, .about04 h2,.about05 h2,.about06 h2{ font-size:2.25rem; font-weight:normal;}
.about03 p{ width:70%;}

.about04 .a4pic img{max-width:900px; height:auto;}
.about05{ box-sizing:border-box;}
.about05 .wa-wrap{ width:40%;float:left;margin:8% 0 0 0;}
.about05 .a5pic{ float:left;width:45%; margin-right:5%; }


.about06{}
.about06 .wa-wrap{ width:45%;float:right;margin:6% 0 0 0;}
.a6pic{ float:left;width:45%; margin-left:5%;}


.trace-detail .wrap{padding-top:60px; margin-top:0}
.trace-detail .clean-mtb{ margin:0 5% 0 5%;padding:20px 0 20px 0;}
.td-first{ border:none; /*border-bottom:1px solid #e5e5e5;*/}
.td-first .td-bpic{ width:50%; float:left;}

.td-first .td-info{ width:50%;float:left; overflow:hidden; }
.td-first .td-info2{ width:100%; margin:0 auto;}
.td-first .td-logo{ text-align:left;}
.td-first .td-info .top{ border-bottom:1px solid #e5e5e5; margin-bottom:1em; }
.td-first .td-info .spic{ float:left; /*display:block; */clear:both; width:30%;}
.td-first .td-info ul{overflow:hidden;}
.td-first .td-info h3{ float:right;width:100%; text-align:left;}
.td-first .td-info h4{float:right;width:70%;text-align:left; font-size:1.375rem;}
.td-first .desinfo{ text-align:left;}
.td-first .desinfo .feather{padding:0; margin-bottom:1rem;font-size:1.3125rem;}
.td-first .desinfo li{ font-size:1.0625rem;}



.td-second h2{color:#4678B9;font-size:2.5rem;}
.td-second h3{text-align:left;}
.td-second .ts-left{ margin-bottom:0; width:44%; margin-right:2%; border-right:1px solid #e5e5e5; float:left; padding-right:5%}
.td-second .ts-left .dockpic{width:30%; float:left;}
.td-second .ts-left .dockpic img{ display:block; height:auto; max-width:110px; text-align:center; margin:0 auto;}
.td-second .ts-left ul{width:70%; float:right; }
.td-second .ts-left li.title{font-size:1.25rem;font-weight:200; }
.td-second .ts-left li.des{ font-size:0.9375rem;text-align:left;}
.td-second .ts-right{float:left;width:41%;text-align:left;padding-right:5%;margin-left:2.5%; }
.td-second .ts-right .des{ width:100%;}
.td-third h3{ font-size:1.625rem; top:30px;}
.td-forth{ padding:5% 0; overflow:hidden;}
.td-forth .wrap{ width:90%; padding-top:0}
.td-forth .tf-pic{ margin:1em 0}
.td-forth div{ margin-bottom:0; width:44%; float:left; margin:0 3%}
.td-forth div.onlyone{ width:0 auto; width:100%;}
.td-forth div.onlyone .des{ width:70%; margin:auto;}

.td-fifth .tf-clean{ width:60%; max-width:400px;}
.td-fifth{ padding:2% 0 2% 0;}
.td-fifth .wrap{ padding:0;}

.td-sixth{ padding:0;}
.td-sixth li{width:60%;max-width:400px; padding:15px 0}



.trace-detail{padding-top: 60px;}
.tracedown .searchwrap{ margin:0 15%; padding:2% 2% 1.5% 5%; overflow:hidden;}
.tracedown .searchwrap li{ float:left;margin-right:1%; display:block; overflow:hidden;}

.tracedown .searchwrap .search-font{ background:url(../img/traceable/trace-arrow.png) no-repeat calc(100% - 5px) 13px; font-size:1.1875rem; padding:5px 2% 0 0; width:23%}
.tracedown .searchwrap li.go{padding:1.5% 2%; display: block; width:8%; float:left; clear:none;}
.tracedown .flowpic{ display:block;margin:0 }
.tracedown .searchwrap .typeword{ width:55%;}
.tracedown .searchwrap input{ background:#666; color:#fff; padding:0 10%; width:80%; }
.tracedown div.flowpic img{max-width:810px; max-height:280px; }

.contact-wrap .wrap { margin:0 auto; padding-top:60px; width:760px;}
.cw-formwrap{ width:100%;}
.il-article { overflow: hidden; display: block; background: #fff; padding: 0; margin: 0; box-sizing: border-box; border-bottom: 1px solid #ccc; }
.il-article:last-child { margin-bottom: 50px; }
.il-article ul { width: 25%; float: left; padding: 1% 1% 1% 1%; border-left: 1px solid #ccc; box-sizing: border-box; overflow: hidden; display: block; margin: 0; min-height: 555px; overflow:hidden; }
.il-article ul:first-child { width: 50%; border-left: none; box-sizing: border-box; }
.dr-inpage { padding-top: 60px; }
.dr-inpage .wrap { margin: 80px 0 50px 0; }
.dr-inpage .di-edit { width: 900px; margin: 0 auto; }
.dr-inpage .di-social { width: 900px; margin: 20px auto 0 auto; text-align: center; }
.dr-inpage .di-edit h3 { font-size: 1.75rem; text-align: center; width: 96%; }
.dr-inpage .di-edit img { }

.top-article .ta-left { width: 51.5%; float: left; max-height:330px }
.top-article .ta-left img{ width:100%; height:auto;}
.top-article .ta-right h3 { border-bottom: 1px solid #A1A8BA; padding-bottom: 10px; margin-bottom: 10px; }
.top-article .ta-right h4 { font-size: 1rem; overflow: hidden; }
.top-article .ta-right { width: 42.5%; float: left; padding: 4% 3% 0 3%; }
.drlist-sort ul { display: block; overflow: hidden; }
.drlist-sort li { }
.drlist-sort .ds-title { display: inline-block; float: left; }
.ca-each ul { width: 48%; float: left; padding: 3% 0; }
.ca-each .ca-pic { margin-bottom: 10px; min-height:280px; }
.ca-each h3 { padding-bottom: 10px; }
.ca-each ul:nth-child(2n) { width: 48%; margin-left: 4%; }

.drlist-sort select { display: none; }
.index-quick .iq-left { width: 40%; background-size: auto 220px; height: 170px; }
.index-quick .iq-right { height: 170px; background-size: auto 180px; width: 40%; }
.footer { padding: 3% 5%; }
.foot-left { float: left; width: 80%; }
.foot-right { float: right; width: 20%; }
.foot-left ul { float: left; width: 17%; margin-right: 3%; border: none; }
.foot-left li { display: block; }
.foot-left .fl-title { border-bottom: 1px solid #333; }
.footer .wrap { padding: 0; }
.foot-left { text-align: left; }
}

@media (min-width: 1000px) {
.issues-list .box { width: 307px; overflow: hidden; padding: 0 0 34px 0; margin: 0; float: left; }
.td-newlot{ margin-bottom:0;}
}

@media (min-width: 1025px) {
/*桌機小螢幕*/

.about02 .wa-wrap{ width:56%; margin:0 5% 0 5%; float:right;}
.about04 .wa-wrap{ margin:0 5%;}
.about04 .a4pic{ margin:0 5% 0 5%;}

.issues-list { padding-top: 60px; }
.issues-list .il-text { width: 90%; margin: 0 auto; }
.issues-list .wrap { width: 1180px; margin: 0 auto; padding-top: 60px; }
.issues-list .box h3 { margin: 5% 0 0 5% }
.issues-list .box { padding: 1%; width: 23%; }
.issues-list .box:nth-child(3n+1) { width: 45%; }
#container { margin: 0 auto; }
.dr-inpage .di-edit { width: 900px; margin: 0 auto; }
.ca-each ul { width: 23.125%; border-bottom: none; padding: 0; margin-left: 2.5%; margin-bottom: 2.5%; }
.ca-each h3 { border-bottom:1px solid #666; }
.ca-each ul:nth-child(2n) { width: 23.125%; margin-left: 2.5% }
.ca-each ul:nth-child(4n+1) { margin-left: 0 }
.ca-each .ca-pic { width: 100%; float: none; }
.center-article { margin-top: 30px; }
.ca-each li { width: 100%; margin-left:0;}
.index-quick .iq-left { width: 40%; padding: 3% 5% }
.index-quick .iq-right { width: 40%; padding: 3% 5% }
.index .slide a .wrap { height: 500px; position: relative }


.tracedown{ padding-top: 60px; }
.tracedown .wrap{width: 1180px; margin: 0 auto; padding: 60px 0; }
.flowpic{margin: 0 auto; text-align:center; }
.tracedown .searchwrap{margin:0 20%; padding:2% 2% 1.5% 4%;}
.tracedown .searchwrap .search-font{ background:url(../img/traceable/trace-arrow.png) no-repeat calc(100% - 10px) 13px; }


.td-sixth{ margin:0 20% 30px 20%; overflow:hidden;}
}

@media (min-width: 1280px) {
/*筆電*/
#nav > ul { margin-right: 5%; }
.fl-fontwrap { }
.dr .wrap { width: 1180px; margin: 0 auto; padding: 60px 0; }
.dr-inpage .wrap { width: 1180px; margin: 0 auto; padding: 60px 0; }
.contact-wrap{ background-size:100vw 100%; min-height:500px;}
.contact-wrap .wrap { width: 800px; margin: 0 auto; padding:60px 0; }

.trace-detail .wrap{width: 1180px; margin: 0 auto; }
.td-forth{ padding:60px 0; }
.td-forth .wrap{ width:1180px; margin:0 auto; clear:both; float:none;}
.td-sixth .wrap{ margin:0 auto; clear:both; width:auto;}
.td-sixth .des{ width:70%;}
.tt-mapwrap{ width:960px; margin:0 auto;}

.about01 ul{ width:80%; margin:0 10% 0 10%; }
.about01 .wrap{ width:1180px; }
.about02 .wa-wrap{ width:40%; margin-right:15%}
.about03{ padding:60px 0;}
.about03 .wa-wrap{ width:1180px; margin:0 auto;}
.about04{padding:60px 0;}
.about04 .wa-wrap{ width:1180px; margin:0 auto;}
.about05{ padding:30px 0 10px 0;}
.about05 .wrap { width:1180px; margin:0 auto;}
.about05 .wa-wrap{ margin:14% 0 0 0;}
.about06{ padding-top:20px;}
.about06 .wrap { width:1180px; margin:0 auto;}
}

@media (min-width: 1370px) {
/*筆電*/
.index .slide a .wrap { height: 560px; position: relative }
.index-quick .iq-left { width: 34%; padding: 20px 8%; height: 220px; background-size: auto 250px; }
.index-quick .iq-left h3 { font-size: 1.5rem; font-weight: 200; margin-bottom: 10px; }
.index-quick .iq-left h4 { font-size: 0.9375rem; }
.index-quick .iq-right { width: 34%; padding: 20px 12% 20px 4%; height: 220px; background-size: auto 230px; }
.index-quick .iq-right h3 { font-size: 1.875rem; width: 60%; }
.footer { padding: 30px 0; }
.footer .wrap { width: 1180px; margin: 0 auto; }
.footer2 { padding: 10px 0; }
.footer2 .copyright { width: 1180px; margin: 0 auto; padding: 0 0 0 0 }
.index .fontwrap h2 { padding-left: 8% }



}

@media (min-width: 1450px) {
/*大螢幕*/

.header { margin-left: -600px; }
.index .slide a .wrap { height: 630px; position: relative }
.index .fontwrap { padding-left: 350px }
.index .fontwrap h2 { padding: 0; margin: 0 0 250px 0; font-size: 3rem; }
.index-quick .iq-left { width: 26%; padding: 20px 5% 20px 19%; height: 220px; background-size: auto 250px; }
.tracedown .il-text h3 { color: #333; font-size: 1.0625rem; font-weight: normal; margin: 1rem auto; text-align: center; width:80%; }
}

@media (min-width: 1660px) {
.index .fontwrap { }
#nav > ul { margin-right: 230px; }
.index .fontwrap { padding-left: 225px }
.index-quick .iq-left { width: 32%; padding: 20px 3.5% 20px 14.5%; }
}

@media (min-width: 1690px) {
#nav > ul { margin-right: 370px; }
.index .slide a .wrap { height: 630px; position: relative }
.index .fontwrap { padding-left: 360px; }
.index .fontwrap h2 { padding: 0; margin: 0 0 250px 0; font-size: 3rem; }
.index-quick .iq-left { width: 26%; padding: 20px 5% 20px 19%; height: 220px; background-size: auto 250px; }
.dr .wrap { width: 1180px; margin: 0 auto; }
.contact-wrap{ min-height:610px;}
.il-article ul {min-height: 600px; }
}

@media (min-width: 1921px) {
/*大於1920*/
 
.header { margin-left: -590px; }
}

/*# sourceMappingURL=design.css.map */