@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Abel);
@import url(https://fonts.googleapis.com/css?family=Lato:400,700);
@import url(https://fonts.googleapis.com/css?family=Oxygen);
html,
body {
  width: 100%;
  min-height: 100%;
  height: auto;
  padding: 0px;
  margin: 0px;
  text-align: left;
  overflow: visible;
  font-size: 15px;
  color: #0f0f0f;
  background-color: #ffffff;
  line-height: 1.6;
  font-family: 'LiHei Pro', '微軟正黑體' , sans-serif;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.pace {
  -webkit-pointer-events: none;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .pace:after {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 99999;
    display: block; }

.pace-inactive {
  display: none; }

.pace .pace-progress {
  background: #000;
  position: fixed;
  z-index: 200000;
  top: 0;
  right: 100%;
  width: 100%;
  height: 3px; }

/*共用屬性*/
*,
*:after,
*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

* {
  -webkit-overflow-scrolling: touch; }

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

a:active, a:hover {
  outline: none; }

img {
  max-width: 100%;
  width: auto;
  height: auto; }

input[type="text"] {
  -webkit-appearance: none;
  border-radius: 0; }

/*泛用表格*/
.t {
  display: table; }
  .t > .t-row, .t > ul {
    display: table-row; }
    .t > .t-row > .t-cell, .t > .t-row > li, .t > ul > .t-cell, .t > ul > li {
      display: table-cell;
      vertical-align: middle;
      border-collapse: collapse;
      margin: 0;
      padding: 0; }

/*定義區塊*/
.container {
  margin: auto;
  position: relative;
  z-index: 100;
  width: 1312px;
  max-width: 100%;
  padding-left: 5px;
  padding-right: 5px; }

.row {
  margin-left: -5px;
  margin-right: -5px; }

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
  position: relative;
  min-height: 1px;
  float: left;
  padding-left: 5px;
  padding-right: 5px; }

.col-12 {
  width: 100%; }

.col-11 {
  width: 91.66666667%; }

.col-10 {
  width: 83.33333333%; }

.col-9 {
  width: 75%; }

.col-8 {
  width: 66.66666667%; }

.col-7 {
  width: 58.33333333%; }

.col-6 {
  width: 50%; }

.col-5 {
  width: 41.66666667%; }

.col-4 {
  width: 33.33333333%; }

.col-3 {
  width: 25%; }

.col-2 {
  width: 16.66666667%; }

.col-1 {
  width: 8.33333333%; }

.pic {
  position: relative;
  font-size: 0; }
  .pic > span {
    width: 100%;
    height: 100%;
    position: absolute;
    text-align: center; }
    .pic > span:before {
      content: ' ';
      display: inline-block;
      height: 100%;
      width: 0;
      vertical-align: middle; }
    .pic > span > img, .pic > span > iframe {
      max-width: 100%;
      max-height: 100%;
      width: auto;
      height: auto;
      display: inline-block;
      vertical-align: middle; }
    .pic > span > iframe {
      width: 100%;
      height: 100%; }

.cf:after,
.row:after,
dl:after {
  display: block;
  height: 0;
  clear: both;
  content: "";
  visibility: hidden; }

.bg_img {
  background-size: cover; }

.editor {
  word-break: break-all;
  margin-top: 15px;
  font-size: 15px; }
  .editor i {
    font-style: italic; }
  .editor em, .editor b, .editor strong {
    font-weight: bold; }
  .editor img {
    height: auto !important; }
  .editor html, .editor address, .editor blockquote, .editor body, .editor dd, .editor div, .editor dl, .editor dt, .editor fieldset, .editor form,
  .editor frame, .editor frameset, .editor h1, .editor h2, .editor h3, .editor h4, .editor h5, .editor h6, .editor noframes, .editor ol, .editor p, .editor ul, .editor center,
  .editor dir, .editor hr, .editor menu, .editor pre {
    display: block; }
  .editor li {
    display: list-item; }
  .editor head {
    display: none; }
  .editor table {
    display: table; }
  .editor tr {
    display: table-row; }
  .editor thead {
    display: table-header-group; }
  .editor tbody {
    display: table-row-group; }
  .editor tfoot {
    display: table-footer-group; }
  .editor col {
    display: table-column; }
  .editor colgroup {
    display: table-column-group; }
  .editor td, .editor th {
    display: table-cell; }
  .editor caption {
    display: table-caption; }
  .editor th {
    font-weight: bolder;
    text-align: center; }
  .editor caption {
    text-align: center; }
  .editor body {
    margin: 8px; }
  .editor h1 {
    font-size: 2em;
    margin: .67em 0; }
  .editor h2 {
    font-size: 1.5em;
    margin: .75em 0; }
  .editor h3 {
    font-size: 1.17em;
    margin: .83em 0; }
  .editor h4, .editor p, .editor blockquote, .editor ul, .editor fieldset, .editor form, .editor ol, .editor dl, .editor dir, .editor menu {
    margin: 1.12em 0; }
  .editor h5 {
    font-size: .83em;
    margin: 1.5em 0; }
  .editor h6 {
    font-size: .75em;
    margin: 1.67em 0; }
  .editor h1, .editor h2, .editor h3, .editor h4, .editor h5, .editor h6, .editor b, .editor strong {
    font-weight: bolder; }
  .editor blockquote {
    margin-left: 40px;
    margin-right: 40px; }
  .editor i, .editor cite, .editor em, .editor var, .editor address {
    font-style: italic; }
  .editor pre, .editor tt, .editor code, .editor kbd, .editor samp {
    font-family: monospace; }
  .editor pre {
    white-space: pre; }
  .editor button, .editor textarea, .editor input, .editor select {
    display: inline-block; }
  .editor big {
    font-size: 1.17em; }
  .editor small, .editor sub, .editor sup {
    font-size: .83em; }
  .editor sub {
    vertical-align: sub; }
  .editor sup {
    vertical-align: super; }
  .editor table {
    border-spacing: 2px; }
  .editor thead, .editor tbody, .editor tfoot {
    vertical-align: middle; }
  .editor td, .editor th {
    vertical-align: inherit; }
  .editor s, .editor strike, .editor del {
    text-decoration: line-through; }
  .editor hr {
    border: 1px inset; }
  .editor ol, .editor ul, .editor dir, .editor menu, .editor dd {
    margin-left: 40px; }
  .editor ol {
    list-style-type: decimal; }
  .editor ul {
    list-style-type: inherit; }
  .editor ol ul, .editor ul ol, .editor ul ul, .editor ol ol {
    margin-top: 0;
    margin-bottom: 0; }
  .editor u, .editor ins {
    text-decoration: underline; }
  .editor br:before {
    content: "\A"; }
  .editor :before, .editor :after {
    white-space: pre-line; }
  .editor center {
    text-align: center; }
  .editor :link, .editor :visited {
    text-decoration: underline; }
  .editor :focus {
    outline: thin dotted invert; }

.template {
  overflow-x: hidden; }

/*header*/
header {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0; }
  header .container {
    padding: 0;
    background-color: rgba(0, 0, 0, 0.45);
    color: #fff;
    font-size: 0;
    z-index: 1; }
    header .container #logo {
      display: inline-block;
      vertical-align: middle;
      width: 35%;
      padding-left: 20px;
      font-size: 0; }
      header .container #logo .img-row {
        display: inline-block;
        vertical-align: middle;
        max-width: 100%;
        width: 50%; }
        header .container #logo .img-row img {
          display: inline-block;
          vertical-align: middle; }
          header .container #logo .img-row img + img {
            margin-left: 3%; }
      header .container #logo p {
        display: inline-block;
        vertical-align: middle;
        font-size: 18px;
        padding-left: 12px;
        width: 50%; }
        header .container #logo p span {
          position: relative;
          bottom: -5px;
          display: block; }
    header .container nav {
      width: calc( 100% - 35% - 140px);
      display: inline-block;
      vertical-align: middle;
      text-align: right;
      padding-right: 1%; }
      header .container nav .menu {
        display: inline-block;
        vertical-align: middle;
        font-size: 18px;
        width: 100%;
        font-weight: bold; }
        header .container nav .menu .home_1024 {
          display: none; }
        header .container nav .menu > li {
          display: inline-block;
          vertical-align: middle;
          width: calc( 100% / 7);
          margin: 0 -5px;
          text-align: center; }
          header .container nav .menu > li.active a {
            color: #f1be25; }
          header .container nav .menu > li > a:hover {
            color: #f1be25; }
          header .container nav .menu > li.sub_list .sub.active {
            cursor: pointer;
            visibility: visible;
            max-height: 5000px;
            opacity: 1; }
          header .container nav .menu > li.sub_list .sub {
            position: absolute;
            width: 100%;
            left: 0;
            text-align: left;
            background-color: rgba(0, 0, 0, 0.7);
            font-size: 0;
            visibility: hidden;
            max-height: 0;
            opacity: 0;
            z-index: 999;
            top: 100%;
            line-height: 1.6; }
            header .container nav .menu > li.sub_list .sub ul {
              display: inline-block;
              vertical-align: top;
              width: calc( 100%/5);
              height: 245px; }
              header .container nav .menu > li.sub_list .sub ul li {
                font-size: 16px;
                display: inline-block;
                vertical-align: top;
                width: 50%;
                padding: 10px 0; }
                header .container nav .menu > li.sub_list .sub ul li:hover a {
                  color: #f1be25; }
                header .container nav .menu > li.sub_list .sub ul li:nth-child(2n-1) {
                  padding-right: 15px; }
                header .container nav .menu > li.sub_list .sub ul li:nth-child(2n) {
                  padding-left: 15px; }
              header .container nav .menu > li.sub_list .sub ul h2 {
                font-weight: bold;
                text-align: center;
                margin: 0 15px;
                font-size: 20px;
                padding: 15px 0;
                border-bottom: 1px solid #ddd; }
    header .container #enl {
      width: 140px;
      display: inline-block;
      vertical-align: middle;
      text-align: right;
      font-size: 0; }
      header .container #enl #email a div,
      header .container #enl #lang a div {
        width: 0px;
        height: 100%;
        display: inline-block;
        vertical-align: middle; }
      header .container #enl #email a:before,
      header .container #enl #lang a:before {
        content: '';
        width: 0px;
        height: 100%;
        display: inline-block;
        vertical-align: middle; }
      header .container #enl #email a span,
      header .container #enl #lang a span {
        display: inline-block;
        vertical-align: middle; }
      header .container #enl #email {
        width: 50%;
        display: inline-block;
        vertical-align: middle; }
        header .container #enl #email a {
          display: block;
          font-size: 18px;
          text-align: center;
          background-color: #f1be25;
          color: #000;
          height: 100px; }
      header .container #enl #lang {
        width: 50%;
        display: inline-block;
        vertical-align: middle;
        position: relative; }
        header .container #enl #lang:hover #lang_list {
          display: block; }
        header .container #enl #lang a {
          display: block;
          background-color: rgba(0, 0, 0, 0.4);
          font-size: 15px;
          text-align: center;
          padding: auto 22%;
          height: 100px;
          width: auto; }
        header .container #enl #lang #lang_list {
          position: absolute;
          width: 100%;
          display: none; }
          header .container #enl #lang #lang_list a.lang_choose {
            height: auto !important;
            padding: 10px 0; }
          header .container #enl #lang #lang_list a:hover {
            background-color: #f1be25;
            color: #000; }

/*index首頁*/
#banner {
  position: relative; }
  #banner .banner_slider {
    height: 100%;
    width: 100%;
    display: block;
    overflow: visible;
    text-align: center;
    margin-bottom: 0; }
    #banner .banner_slider .slick-prev,
    #banner .banner_slider .slick-next {
      width: auto;
      height: auto;
      z-index: 500;
      margin: 0;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); }
    #banner .banner_slider .slick-prev {
      left: 10%; }
      #banner .banner_slider .slick-prev:before {
        content: url(../_img/index/arrow_prev.png); }
    #banner .banner_slider .slick-next {
      right: 10%; }
      #banner .banner_slider .slick-next:before {
        content: url(../_img/index/arrow_next.png); }
    #banner .banner_slider h2 {
      font-family: 'Roboto', sans-serif;
      font-weight: 400;
      font-size: 60px;
      color: #fff;
      line-height: 55px;
      margin: 10px 0 0; }
    #banner .banner_slider p {
      font-family: 'Roboto', sans-serif;
      font-weight: 100;
      font-size: 20px;
      color: #fff;
      letter-spacing: 3px; }
    #banner .banner_slider .item {
      width: 100%;
      font-size: 0; }
      #banner .banner_slider .item:before {
        content: '';
        width: 0px;
        height: 100%;
        display: inline-block;
        vertical-align: middle; }
      #banner .banner_slider .item span {
        position: absolute;
        width: 100%;
        left: 0;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
      #banner .banner_slider .item .bg_img {
        width: 100%;
        padding-bottom: 56.5%;
        position: relative; }
  #banner #scroll_down {
    width: 90px;
    height: 38px;
    position: absolute;
    bottom: 0;
    z-index: 200;
    left: 0;
    right: 0;
    margin: auto; }

#banner2 {
  position: absolute;
  width: 100%; }
  #banner2 .banner_slider2 {
    height: 100%;
    width: 100%;
    display: block;
    overflow: visible;
    text-align: center;
    margin-bottom: 0; }
    #banner2 .banner_slider2 .slick-prev,
    #banner2 .banner_slider2 .slick-next {
      width: auto;
      height: auto;
      z-index: 500; }
    #banner2 .banner_slider2 .slick-prev {
      left: 10%; }
      #banner2 .banner_slider2 .slick-prev:before {
        content: url(../_img/index/arrow_prev.png); }
    #banner2 .banner_slider2 .slick-next {
      right: 10%; }
      #banner2 .banner_slider2 .slick-next:before {
        content: url(../_img/index/arrow_next.png); }
    #banner2 .banner_slider2 .item {
      width: 100%;
      height: 40vh; }

#banner3 {
  position: relative; }
  #banner3 .banner_slider3 {
    height: 100%;
    width: 100%;
    display: block;
    overflow: visible;
    text-align: center;
    margin-bottom: 0; }
    #banner3 .banner_slider3 .slick-prev,
    #banner3 .banner_slider3 .slick-next {
      width: auto;
      height: auto;
      z-index: 500; }
    #banner3 .banner_slider3 .slick-prev {
      left: 10%;
      top: 35%; }
      #banner3 .banner_slider3 .slick-prev:before {
        content: url(../_img/index/arrow_prev.png); }
    #banner3 .banner_slider3 .slick-next {
      right: 10%;
      top: 35%; }
      #banner3 .banner_slider3 .slick-next:before {
        content: url(../_img/index/arrow_next.png); }
    #banner3 .banner_slider3 .item {
      width: 100%;
      height: 40vh; }

#index article {
  text-align: center;
  padding-top: 60px;
  position: relative; }
  #index article .title {
    font-family: '微軟正黑體';
    font-size: 48px;
    margin-bottom: 54px; }
    #index article .title:after {
      content: '';
      display: block;
      width: 50px;
      height: 3px;
      background-color: #a0a0a0;
      margin: 0 auto; }
  #index article p {
    margin-bottom: 60px;
    font-size: 20px; }
  #index article #feature {
    padding: 50px 0 360px;
    position: relative;
    width: 100%;
    z-index: 300; }
    #index article #feature:after {
      content: '';
      width: 1px;
      height: 100%;
      top: 0;
      background-color: #f1e0ac;
      position: absolute;
      left: 50%; }
    #index article #feature .item {
      font-size: 0;
      position: relative; }
      #index article #feature .item:after {
        content: '';
        display: table;
        clear: both; }
      #index article #feature .item:before {
        content: '';
        position: absolute;
        background-color: #f1be25;
        width: 12px;
        height: 12px;
        border-radius: 6px;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        display: inline-block;
        vertical-align: middle;
        z-index: 400; }
      #index article #feature .item .content {
        font-size: 0;
        display: inline-block;
        vertical-align: middle;
        width: 40%;
        float: left;
        margin-left: 7%; }
        #index article #feature .item .content .startup {
          width: 40%;
          height: 0;
          padding-bottom: 40%;
          display: inline-block;
          vertical-align: middle;
          background-size: contain;
          background-position: 50% 50%;
          background-repeat: no-repeat; }
        #index article #feature .item .content span {
          display: block;
          width: 60%;
          display: inline-block;
          vertical-align: middle;
          direction: ltr; }
          #index article #feature .item .content span h4 {
            font-size: 48px; }
          #index article #feature .item .content span p {
            font-size: 20px;
            text-align: left;
            padding-left: 4%;
            padding-right: 4%;
            padding-top: 5%;
            line-height: 30px; }
      #index article #feature .item:nth-child(even) .content {
        float: right;
        direction: rtl;
        margin-right: 7%; }
  #index article .bg_bottom {
    background-image: url(../_img/index/bg_02.jpg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: right bottom;
    right: 0;
    bottom: 0;
    width: 1566px;
    max-width: 100%;
    height: 0;
    padding-bottom: 29%;
    display: block;
    position: absolute;
    z-index: 0; }

/*footer-公司聯絡資訊*/
footer .footer_menu {
  height: auto;
  width: 100%;
  background-color: #000; }
  footer .footer_menu .container {
    width: 75%;
    float: none;
    text-align: center;
    padding: 2%;
    color: #fff;
    font-size: 0; }
    footer .footer_menu .container .company {
      text-align: left;
      width: 25%;
      line-height: 30px;
      display: inline-block;
      vertical-align: top;
      padding-left: 15px;
      padding-right: 15px; }
      footer .footer_menu .container .company .company_name {
        color: #1c5fe0;
        color: #fff;
        font-size: 15px; }
      footer .footer_menu .container .company h5 {
        color: #fff;
        font-size: 15px; }
      footer .footer_menu .container .company li {
        color: #666666;
        color: #fff;
        font-size: 12px;
        list-style: none; }
      footer .footer_menu .container .company .email {
        text-decoration: underline; }

/*bottom-Copyright */
.bottom {
  background-color: #000;
  padding-top: 12px;
  padding-bottom: 12px;
  width: 100%;
  text-align: center;
  color: #666666;
  font-size: 12px; }

.fancybox-overlay-fixed {
  z-index: 8000; }

#gotop {
  display: none;
  position: fixed;
  right: 5%;
  bottom: 5%;
  padding: 10px 15px;
  font-size: 10px;
  background: #333;
  color: white;
  cursor: pointer;
  border-radius: 2px;
  opacity: 0.7;
  z-index: 9999; }
  #gotop:hover {
    background: #000;
    -o-transition: all .35s linear;
    -webkit-transition: all .35s linear;
    -moz-transition: all .35s linear;
    transition: all .35s linear; }

#product2 #fullpage h2 {
  font-size: 30px; }

#menu_product2 {
  position: fixed;
  z-index: 1;
  color: #fff;
  top: 50%;
  right: 10px; }
  #menu_product2 li {
    text-align: right; }
    #menu_product2 li a {
      border: 1px solid rgba(0, 0, 0, 0.7);
      margin-bottom: 10px;
      display: inline-block;
      border-radius: 20px;
      width: 35px;
      height: 35px;
      line-height: 35px;
      text-align: center; }
      #menu_product2 li a span {
        display: none; }
    #menu_product2 li:hover a {
      width: auto;
      padding: 0 10px;
      color: #fff;
      border: 2px solid #fff;
      background: rgba(0, 0, 0, 0.7); }
      #menu_product2 li:hover a span {
        display: inline-block; }
    #menu_product2 li.active a {
      color: #fff;
      border: 2px solid #fff;
      background: rgba(0, 0, 0, 0.7); }

.page {
  font-size: 18px;
  text-align: center; }
  .page a {
    padding: 0 10px;
    width: auto !important; }

#about #page_banner {
  height: 300px;
  width: 100%; }

#about article {
  text-align: center;
  padding-top: 60px; }
  #about article .title {
    font-family: '微軟正黑體';
    font-size: 30px;
    color: #000;
    margin-bottom: 54px; }
    #about article .title:after {
      content: '';
      display: block;
      width: 50px;
      height: 3px;
      background-color: #a0a0a0;
      margin: 0 auto; }
  #about article section {
    padding-top: 5%;
    padding-bottom: 5%; }
    #about article section h5 {
      font-size: 20px; }
    #about article section li {
      font-size: 24px;
      line-height: 40px;
      list-style: none; }
    #about article section p {
      display: inline-block;
      vertical-align: middle;
      font-size: 15px;
      line-height: 30px;
      text-align: left; }
    #about article section h4 {
      font-size: 26px;
      line-height: 36px; }
    #about article section .half {
      width: 50%;
      text-align: left;
      font-size: 24px;
      padding-left: 10px;
      padding-right: 10px;
      display: inline-block;
      vertical-align: top; }
  #about article #section1 {
    padding-top: 0; }
  #about article #section2 {
    background-color: #eeeeee; }
    #about article #section2 .item_display {
      padding-top: 40px; }
      #about article #section2 .item_display a {
        padding-left: 5px;
        padding-right: 5px;
        display: block; }
  #about article #section3 {
    background-image: url(../_img/about/bg_01.jpg);
    background-size: cover; }
    #about article #section3 .container {
      font-size: 0;
      padding-left: 5%;
      padding-right: 5%; }
      #about article #section3 .container .title_left {
        font-size: 30px; }

#about .section4 {
  text-align: left;
  background-image: url(../_img/about/bg_02.jpg);
  background-repeat: no-repeat;
  background-position: 0 15%; }
  #about .section4 .container {
    padding-left: 5%;
    padding-right: 5%; }
    #about .section4 .container .company_vietnam {
      font-size: 0;
      padding-bottom: 5%; }
      #about .section4 .container .company_vietnam .half {
        width: 50%;
        text-align: left;
        font-size: 24px;
        display: inline-block;
        vertical-align: middle; }
  #about .section4 .company {
    margin-top: 6%;
    margin-bottom: 6%; }
  #about .section4 .section_list {
    padding-top: 3%;
    font-size: 0; }
    #about .section4 .section_list:last-child {
      margin-bottom: 50px;
      padding-left: 10px;
      padding-right: 10px; }
    #about .section4 .section_list .item_title {
      font-size: 18px;
      color: #0c56d8;
      display: inline-block;
      vertical-align: middle; }
      #about .section4 .section_list .item_title:before {
        content: '';
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background-color: #f1be25;
        display: inline-block;
        vertical-align: middle;
        margin-right: 8px; }
    #about .section4 .section_list .item_p {
      padding-left: 16px;
      padding-top: 5px; }

#news #page_banner {
  height: 300px;
  width: 100%; }

#news article {
  text-align: center;
  padding-top: 60px; }
  #news article .title {
    font-family: '微軟正黑體';
    font-size: 30px;
    color: #000;
    margin-bottom: 54px; }
    #news article .title:after {
      content: '';
      display: block;
      width: 50px;
      height: 3px;
      background-color: #a0a0a0;
      margin: 0 auto; }
  #news article .container {
    font-size: 0; }
    #news article .container .news_item {
      text-align: left;
      line-height: 1.6rem;
      vertical-align: top;
      padding: 5px;
      margin: 10px 0; }
      #news article .container .news_item a:hover .pic > span img {
        opacity: .8;
        -webkit-transition: all .2s linear;
        -o-transition: all .2s linear;
        transition: all .2s linear; }
      #news article .container .news_item a:hover .pic .mask {
        opacity: 1; }
      #news article .container .news_item .pic {
        width: 100%;
        height: 0;
        padding-bottom: 62.5%;
        display: block;
        position: relative; }
        #news article .container .news_item .pic > span {
          left: 0; }
          #news article .container .news_item .pic > span img {
            opacity: 1;
            -webkit-transition: all .2s linear;
            -o-transition: all .2s linear;
            transition: all .2s linear; }
        #news article .container .news_item .pic .mask {
          background: rgba(255, 255, 255, 0.6);
          width: 100%;
          height: 100%;
          position: absolute;
          left: 0;
          top: 0;
          opacity: 0;
          -webkit-transition: all .2s linear;
          -o-transition: all .2s linear;
          transition: all .2s linear; }
          #news article .container .news_item .pic .mask > ul > li {
            width: 100%;
            height: 100%;
            vertical-align: middle;
            text-align: center; }
            #news article .container .news_item .pic .mask > ul > li .more-icon {
              display: inline-block;
              width: 120px;
              height: 40px;
              border: 1px #333 solid;
              padding: 5px;
              margin: auto;
              color: #333333;
              font-size: 15px; }
      #news article .container .news_item .date {
        color: #666666;
        display: block;
        vertical-align: middle;
        font-size: 15px; }
      #news article .container .news_item .news_title {
        color: #000;
        display: block;
        vertical-align: middle;
        font-size: 18px;
        line-height: 30px;
        overflow: hidden;
        height: 30px; }
      #news article .container .news_item .s_info {
        font-size: 17px;
        line-height: 25px;
        height: 50px;
        overflow: hidden; }
      #news article .container .news_item .more {
        width: 25%;
        color: #f1be25;
        font-style: italic;
        display: inline-block;
        vertical-align: middle;
        font-size: 15px; }
        #news article .container .news_item .more .fa {
          margin-left: 10px; }
    #news article .container .press {
      text-align: left; }
      #news article .container .press .back {
        margin: 25px 0; }
        #news article .container .press .back a {
          width: 150px;
          max-width: 100%;
          margin: 0 auto;
          display: block;
          color: #f1be25;
          padding: 10px 40px;
          border: 4px double #f1be25;
          -webkit-transition: all 0.2s linear;
          -o-transition: all 0.2s linear;
          transition: all 0.2s linear;
          font-size: 1rem; }
          #news article .container .press .back a:hover {
            background-color: #f1be25;
            color: #fff;
            border: 4px double transparent;
            -webkit-transition: all 0.2s linear;
            -o-transition: all 0.2s linear;
            transition: all 0.2s linear; }
      #news article .container .press .pic {
        width: 100%;
        height: 0;
        padding-bottom: 75%;
        display: block; }
      #news article .container .press .date {
        color: #666666;
        font-size: 15px; }
      #news article .container .press .news_title {
        color: #000;
        font-size: 20px;
        white-space: nowrap;
        border-bottom: 1px solid #e5e5e5;
        padding-bottom: 10px;
        margin-bottom: 10px; }
    #news article .container .page {
      margin-top: 10px;
      margin-bottom: 15px;
      font-size: 0; }
      #news article .container .page a {
        color: #666666;
        display: inline-block;
        vertical-align: middle;
        padding: 5px;
        font-size: 15px;
        margin: 30px; }
        #news article .container .page a:hover {
          color: #f1be25; }
        #news article .container .page a.active {
          color: #f1be25; }
        #news article .container .page a i {
          color: #f1be25;
          padding: 10px 13px;
          border: 1px solid #f1be25;
          border-radius: 4px;
          z-index: 400; }

#product #page_banner {
  height: 300px;
  width: 100%; }

#product article {
  text-align: center;
  padding-top: 60px; }
  #product article .title {
    font-family: '微軟正黑體';
    font-size: 30px;
    color: #000;
    margin-bottom: 54px; }
    #product article .title:after {
      content: '';
      display: block;
      width: 50px;
      height: 3px;
      background-color: #a0a0a0;
      margin: 0 auto; }

#product article .container {
  font-size: 0;
  clear: both;
  padding-bottom: 80px; }
  #product article .container .product_category {
    width: 25%;
    line-height: 30px;
    display: inline-block;
    vertical-align: middle;
    font-size: 15px;
    float: left; }
    #product article .container .product_category .title_category {
      color: #fff;
      background-color: #f1be25; }
    #product article .container .product_category a {
      font-size: 15px;
      text-align: left;
      display: block;
      background-color: #fff;
      color: #666666;
      padding-left: 2rem;
      padding-top: 10px;
      padding-bottom: 10px;
      position: relative;
      line-height: 25px; }
      #product article .container .product_category a:before {
        content: "\f0da";
        font-family: 'FontAwesome';
        font-size: 1rem;
        position: absolute;
        left: .5rem;
        top: 10px;
        line-height: 25px; }
      #product article .container .product_category a:hover, #product article .container .product_category a.active {
        color: #f86f38;
        background-color: rgba(241, 190, 37, 0.2); }
        #product article .container .product_category a:hover i, #product article .container .product_category a.active i {
          color: #f86f38; }
      #product article .container .product_category a i {
        margin: 15px;
        color: #f1be25;
        display: none; }
  #product article .container .product_list {
    width: 75%;
    display: inline-block;
    vertical-align: middle;
    text-align: left; }
    #product article .container .product_list a {
      width: 33.33333333%;
      display: inline-block;
      padding-left: 10px;
      padding-right: 10px; }
      @media only screen and (min-width: 1025px) {
        #product article .container .product_list a:hover .product .detail {
          background-color: rgba(0, 0, 0, 0.7);
          bottom: 0;
          height: 100%;
          color: #f1be25;
          text-align: center;
          -webkit-transition: all .2s linear;
          -o-transition: all .2s linear;
          transition: all .2s linear; }
          #product article .container .product_list a:hover .product .detail .name {
            line-height: 60px; }
          #product article .container .product_list a:hover .product .detail p {
            color: #fff;
            font-size: 15px;
            padding: 20px;
            text-align: left; }
          #product article .container .product_list a:hover .product .detail i {
            color: #f1be25;
            font-size: 25px; }
            #product article .container .product_list a:hover .product .detail i:hover {
              color: #fff; } }
      #product article .container .product_list a .product {
        width: 100%;
        height: 0;
        padding-bottom: 100%;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        overflow: hidden;
        position: relative;
        margin: 0 10px 20px; }
        #product article .container .product_list a .product .detail {
          background-color: rgba(0, 0, 0, 0.7);
          color: #fff;
          width: 100%;
          position: absolute;
          bottom: 0;
          height: 40px;
          text-align: center;
          -webkit-transition: all .2s linear;
          -o-transition: all .2s linear;
          transition: all .2s linear; }
          #product article .container .product_list a .product .detail .name {
            font-size: 20px;
            line-height: 40px; }

.detail_page_cover {
  z-index: inherit; }
  .detail_page_cover .container .product_detail_page {
    width: 1190px;
    height: 600px;
    max-width: 100%;
    background-position: absolute;
    background-color: #fff;
    padding: 20px;
    font-size: 0; }
    .detail_page_cover .container .product_detail_page .product_big {
      width: 55%;
      display: inline-block;
      vertical-align: middle; }
    .detail_page_cover .container .product_detail_page .detail_more {
      width: 45%;
      height: 100%;
      display: inline-block;
      vertical-align: middle;
      font-size: 0;
      position: relative;
      padding: 20px; }
      .detail_page_cover .container .product_detail_page .detail_more .close {
        color: #f1be25;
        font-size: 26px;
        position: absolute;
        right: 0;
        top: 0; }
      .detail_page_cover .container .product_detail_page .detail_more .detail_title {
        font-size: 26px;
        margin-top: 10%;
        text-align: left; }
      .detail_page_cover .container .product_detail_page .detail_more .product_gallery {
        margin-top: 20px; }
        .detail_page_cover .container .product_detail_page .detail_more .product_gallery .product_small {
          display: inline-block;
          float: left;
          width: 32%;
          height: 0;
          padding-bottom: 25%;
          max-width: 100%;
          background-size: cover;
          margin-right: 1%;
          margin-bottom: 10px;
          border: 1px solid transparent;
          background-repeat: no-repeat; }
          @media only screen and (min-width: 641px) {
            .detail_page_cover .container .product_detail_page .detail_more .product_gallery .product_small:hover, .detail_page_cover .container .product_detail_page .detail_more .product_gallery .product_small.active {
              border: 1px solid #f1be25;
              overflow: hidden; } }
      .detail_page_cover .container .product_detail_page .detail_more .detail_content {
        margin-top: 20px;
        font-size: 1rem;
        color: #666666;
        text-align: left; }

/*Fancybox*/
.fancybox-skin {
  background: none;
  padding: 0;
  border-radius: 0; }

.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: none;
  box-shadow: none; }

.fancybox-close {
  background-image: none;
  top: 8%;
  right: 2%; }
  .fancybox-close:after {
    content: '\f00d';
    font-family: 'FontAwesome';
    color: #f1be25;
    font-size: 1rem; }

.fancybox-inner {
  height: auto;
  overflow: overlay;
  background-color: #fff;
  border: 2px solid #f1be25; }

#product2 .slide {
  background-size: cover;
  background-position: 50% 50%; }

#service #page_banner {
  height: 300px;
  width: 100%; }

#service article {
  text-align: center;
  padding-top: 60px; }
  #service article .title {
    font-family: '微軟正黑體';
    font-size: 2rem;
    color: #000;
    margin-bottom: 54px; }
    #service article .title:after {
      content: '';
      display: block;
      width: 50px;
      height: 3px;
      background-color: #a0a0a0;
      margin: 0 auto; }

#service article .container {
  width: 1190px;
  font-size: 0;
  clear: both;
  padding-bottom: 80px; }
  #service article .container .map {
    width: 1190px;
    height: 570px;
    max-width: 100%;
    font-size: 0; }
  #service article .container .company_info {
    margin-top: 50px;
    margin-left: -10px;
    margin-right: -10px; }
    #service article .container .company_info .company_list {
      width: 33.33333%;
      width: 100%;
      display: inline-block;
      vertical-align: top;
      text-align: left;
      padding-left: 10px;
      padding-right: 10px;
      margin: 2rem 0; }
      #service article .container .company_info .company_list:after {
        content: '';
        display: table;
        clear: both; }
      #service article .container .company_info .company_list .txt-row,
      #service article .container .company_info .company_list .img-row {
        float: left;
        margin: 0;
        padding: 0; }
      #service article .container .company_info .company_list .img-row {
        width: 30%; }
      #service article .container .company_info .company_list .txt-row {
        width: 70%;
        padding-left: 2rem; }
      #service article .container .company_info .company_list .location {
        font-size: 18px;
        color: #1c5fe0; }
      #service article .container .company_info .company_list h4 {
        font-size: 26px;
        color: #000;
        line-height: 40px; }
      #service article .container .company_info .company_list li {
        font-size: 1rem; }

#contact #page_banner {
  height: 300px;
  width: 100%; }

#contact article {
  text-align: center;
  padding-top: 60px; }
  #contact article .title {
    font-family: '微軟正黑體';
    font-size: 2rem;
    color: #000;
    margin-bottom: 54px; }
    #contact article .title:after {
      content: '';
      display: block;
      width: 50px;
      height: 3px;
      background-color: #a0a0a0;
      margin: 0 auto; }

#contact article .container {
  text-align: center; }
  #contact article .container .contact_form {
    width: 790px;
    max-width: 100%;
    visibility: visible;
    text-align: center;
    margin: 0 auto; }
    #contact article .container .contact_form .type {
      width: 100%;
      margin: 15px 0;
      font-size: 0; }
      #contact article .container .contact_form .type input {
        width: 48%;
        padding: 10px;
        font-size: 1rem;
        border-style: hidden;
        background-color: #eeeeee;
        border-radius: 1px;
        display: inline-block;
        vertical-align: middle; }
        #contact article .container .contact_form .type input:nth-child(1) {
          margin-right: 3%; }
    #contact article .container .contact_form .textarea textarea {
      padding: 10px;
      font-size: 1rem;
      border-style: hidden;
      background-color: #eeeeee;
      border-radius: 1px;
      display: inline-block;
      vertical-align: middle;
      width: 100%;
      height: 250px; }
  #contact article .container .button_send {
    margin-bottom: 200px;
    margin-top: 70px; }
    #contact article .container .button_send .send {
      color: #f1be25;
      padding: 10px 40px;
      border: 4px double #f1be25;
      -webkit-transition: all 0.2s linear;
      -o-transition: all 0.2s linear;
      transition: all 0.2s linear; }
      #contact article .container .button_send .send:hover {
        background-color: #f1be25;
        color: #fff;
        border: none;
        -webkit-transition: all 0.2s linear;
        -o-transition: all 0.2s linear;
        transition: all 0.2s linear; }

@media only screen and (max-width: 1440px) {
  header .container #logo p {
    font-size: 18px; } }

@media only screen and (max-width: 1024px) {
  #phone_icon .button {
    display: block;
    position: fixed;
    top: 45px;
    right: 30px;
    width: 30px;
    height: 20px;
    border-bottom: 3px solid rgba(128, 128, 128, 0.5);
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    -webkit-transition: all 0.5s ease 0s;
    z-index: 9999;
    cursor: pointer; }
    #phone_icon .button:before, #phone_icon .button:after {
      content: "";
      position: absolute;
      top: 20%;
      width: 100%;
      height: 3px;
      background: rgba(128, 128, 128, 0.5) none repeat scroll 0% 0%; }
    #phone_icon .button:after {
      content: "";
      top: 60%; }
    #phone_icon .button.action {
      display: block;
      width: 30px;
      height: 20px;
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
      -webkit-transform: rotate(90deg);
      border-bottom: medium none !important;
      -webkit-transition: all 0.5s ease 0s;
      -o-transition: all 0.5s ease 0s;
      transition: all 0.5s ease 0s; }
      #phone_icon .button.action:before {
        top: 50%;
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -webkit-transition: all 0.5s ease 0s;
        -o-transition: all 0.5s ease 0s;
        transition: all 0.5s ease 0s; }
      #phone_icon .button.action:after {
        top: 50%;
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -webkit-transition: all 0.5s ease 0s;
        -o-transition: all 0.5s ease 0s;
        transition: all 0.5s ease 0s; }
  .email_button {
    background-color: #f1be25;
    color: #000;
    font-size: 1.5rem;
    display: inline-block;
    margin: 0 auto;
    width: 50px;
    height: 50px; }
  .lang_button {
    color: #fff;
    font-size: 1rem;
    background-color: rgba(0, 0, 0, 0.7);
    text-align: center;
    width: 50px;
    height: 50px; }
  /*header*/
  header {
    z-index: 9000; }
    header .container {
      margin: 0 auto; }
      header .container #logo {
        width: 100%;
        text-align: center;
        background-color: rgba(0, 0, 0, 0.5);
        padding-top: 40px;
        padding-bottom: 10px;
        padding-left: 0; }
        header .container #logo .img-row,
        header .container #logo p {
          width: auto;
          max-width: none; }
        header .container #logo .img-row img {
          max-width: 180px; }
        header .container #logo p {
          text-align: left;
          font-size: 15px; }
      header .container nav {
        display: block;
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background-color: rgba(0, 0, 0, 0.8);
        z-index: 9990;
        display: none;
        overflow: auto; }
        header .container nav.active {
          display: block; }
        header .container nav .menu {
          text-align: center;
          margin-top: 55px; }
          header .container nav .menu .home_1024 {
            display: block; }
          header .container nav .menu li {
            display: block;
            margin: 4% auto;
            line-height: 2rem;
            width: 100%; }
            header .container nav .menu li a:hover {
              color: #f1be25; }
            header .container nav .menu li.sub_list .sub.active {
              position: static;
              max-height: none; }
              header .container nav .menu li.sub_list .sub.active ul {
                display: block;
                width: 100%;
                height: auto; }
                header .container nav .menu li.sub_list .sub.active ul > li {
                  display: block;
                  width: 100%;
                  padding: 5px 15px !important; }
      header .container #enl {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background-color: #000;
        text-align: left;
        line-height: 35px; }
        header .container #enl #email,
        header .container #enl #lang {
          width: auto; }
          header .container #enl #email a,
          header .container #enl #lang a {
            height: auto;
            background: none; }
        header .container #enl #email a span .fa {
          color: #fff;
          padding: 8px; }
        header .container #enl #lang a span .fa,
        header .container #enl #lang a span p {
          display: inline-block;
          vertical-align: middle; }
  /*首頁*/
  #index article #feature .item .content span p {
    line-height: 26px; }
  /*內頁banner*/
  #page_banner {
    display: none; }
  /*內頁*/
  #about article {
    padding-top: 200px; }
  #news article {
    padding-top: 200px; }
  #product article {
    padding-top: 200px; }
  #service article {
    padding-top: 200px; }
  #contact article {
    padding-top: 200px; }
  /*footer*/
  footer .footer_menu .container {
    width: 85%; }
    footer .footer_menu .container .company {
      width: 33%; } }

@media only screen and (max-width: 768px) {
  /*首頁*/
  #index article p {
    margin: auto 30px 20px;
    text-align: left; }
  #index article #feature .item .content {
    text-align: center; }
    #index article #feature .item .content span {
      display: block;
      width: 100%; }
      #index article #feature .item .content span p {
        margin: auto; }
    #index article #feature .item .content .startup {
      display: inline-block;
      width: 80%;
      padding-bottom: 80%;
      margin-top: 20px; }
  /*page title*/
  #about article {
    padding-top: 150px; }
  #news article {
    padding-top: 150px; }
  #product article {
    padding-top: 150px; }
  #service article {
    padding-top: 150px; }
  #contact article {
    padding-top: 150px; }
  /*關於我們*/
  #about .section4 .container .company_vietnam .half {
    width: 100%;
    display: block; }
  #about .section4 .container .section_list:last-child {
    padding-left: 10px;
    padding-right: 10px; }
  #about .section4 .container .section_list .half {
    width: 100%;
    margin-top: 25px; }
  /*服務據點*/
  #service article .container .company_info .company_list h5 {
    font-size: 1rem; }
  #service article .container .company_info .company_list h4 {
    font-size: 20px; }
  #news article .container .news_item {
    width: 100%; }
  #product2 .slide {
    height: 0 !important;
    display: block;
    padding-bottom: 56.25%; }
  #menu_product2 {
    display: none; }
  /*footer*/
  footer .footer_menu {
    height: auto; }
    footer .footer_menu .container {
      padding-left: 15px;
      padding-right: 15px; }
      footer .footer_menu .container .company {
        width: 95%;
        display: block;
        margin-top: 5%; }
        footer .footer_menu .container .company li {
          line-height: 18px; } }

@media only screen and (max-width: 640px) {
  header {
    position: static; }
    header .container #logo .img-row {
      max-width: 100px; }
  /*首頁輪播文字*/
  #index #banner .banner_slider .slick-prev {
    left: 5%; }
  #index #banner .banner_slider .slick-next {
    right: 5%; }
  #index #banner .banner_slider .item span h2 {
    font-size: 26px;
    line-height: 28px; }
  #index article #feature .item:before {
    display: none; }
  #index article #feature .item .content {
    width: 100%; }
  #index article #feature .item:nth-child(even) .content {
    float: none;
    margin-right: 0; }
  #index article #feature:after {
    display: none; }
  /*關於我們*/
  #about article #section3 {
    background-size: cover;
    max-height: none; }
    #about article #section3 .container {
      margin: 0 auto; }
      #about article #section3 .container .half {
        width: 100%;
        display: block;
        text-align: center; }
  /*產品介紹*/
  #product article .container {
    padding-left: 20px;
    padding-right: 20px; }
    #product article .container .product_category {
      width: 100%;
      display: block;
      margin-bottom: 20px; }
      #product article .container .product_category .title_category:after {
        content: '\f0d7';
        font-family: 'FontAwesome';
        font-size: 1rem;
        margin-left: 10px; }
      #product article .container .product_category ul {
        border: 1px solid #f1be25;
        border-top: none;
        max-height: 0;
        overflow: hidden;
        -webkit-transition: all .3s ease-out;
        -o-transition: all .3s ease-out;
        transition: all .3s ease-out; }
        #product article .container .product_category ul.active {
          max-height: 800px;
          -webkit-transition: all .3s ease-in;
          -o-transition: all .3s ease-in;
          transition: all .3s ease-in; }
    #product article .container .product_list {
      width: 100%;
      display: block; }
  .detail_page_cover .container .product_detail_page .product_big {
    width: 100%;
    display: block;
    display: none; }
  .detail_page_cover .container .product_detail_page .detail_more {
    width: 100%;
    display: block;
    padding: 5px; }
    .detail_page_cover .container .product_detail_page .detail_more .detail_title {
      text-align: center; }
    .detail_page_cover .container .product_detail_page .detail_more .product_gallery .product_small {
      width: 48%; }
  /*服務據點*/
  #service .company_info .company_list {
    width: 100%;
    display: block;
    text-align: center; }
  /*聯絡我們*/
  #contact article .container .contact_form .type input {
    display: block;
    width: 98%;
    margin-top: 10px; } }

@media only screen and (max-width: 480px) {
  #phone_icon .button {
    top: 12px;
    right: 15px;
    width: 25px;
    height: 20px;
    border-bottom: 3px solid rgba(255, 255, 255, 0.7); }
    #phone_icon .button:before, #phone_icon .button:after {
      background: rgba(255, 255, 255, 0.7); }
  header .container #logo {
    padding-left: 0; }
    header .container #logo img {
      width: 60px; }
  /*index*/
  #index article #feature .item .content {
    margin: 20px auto; }
  #index article #feature {
    padding-left: 15px; }
  #index article {
    padding-bottom: 20px; }
    #index article .title {
      text-shadow: 1px 1px 3px #fff; }
    #index article .bg_bottom {
      display: none; }
  #index #banner .banner_slider .item span h2 {
    font-size: 15px; }
  #index #banner .banner_slider .item span p {
    font-size: 12px; }
  /*about*/
  #about article section .half + .half {
    margin-top: 20px; }
    #about article section .half + .half br {
      display: none; }
  #about article #section3 .container {
    padding-top: 15px; }
  /*news*/
  #news article .container .news_item {
    width: 100%; }
    #news article .container .news_item .date {
      display: block;
      width: 100%;
      text-align: left; }
    #news article .container .news_item .news_title {
      display: block;
      width: 100%;
      text-align: left; }
    #news article .container .news_item .more {
      margin: 10px auto 15px; }
  #news article .container .page a {
    margin: 8px; }
  /*product*/
  #product article .container .product_list {
    width: 100%; }
    #product article .container .product_list a {
      display: block;
      width: 100%;
      padding: none;
      margin: 5px auto; }
  /*service*/
  #service article .container .map {
    height: auto; }
  #service article .container .company_info .company_list {
    width: 100%;
    display: block;
    margin-top: 30px;
    padding-top: 1rem; }
    #service article .container .company_info .company_list + .company_list {
      border-top: 1px solid #000; }
    #service article .container .company_info .company_list .img-row,
    #service article .container .company_info .company_list .txt-row {
      width: 100%;
      padding: 0; }
    #service article .container .company_info .company_list .txt-row {
      margin-top: 1rem; }
  #contact article .container .button_send {
    margin-bottom: 80px;
    margin-top: 40px; } }

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