/*==========================================
Small Screen
==========================================*/
/*==========================================
Old Screen
==========================================*/
@media screen and (max-width: 1280px) and (min-width: 1025px) {
  .wrap-inner.wrap-more {
    padding: 0 50px; }

  #our-mission, #our-vision {
    height: auto;
    padding: 60px 0; }

  .about-us-list li {
    margin: 0 20px; }

  header nav > div {
    margin-right: calc(30vw / 19.2); }
    header nav > div a {
      font-size: 18px; }
  header .lang-bar a {
    font-size: 16px; }

  .wrap {
    padding: 0 30px; }

  .wrap-inner {
    width: 1000px; }

  .col-lg-1 {
    width: 8.3333%; }

  .col-lg-2 {
    width: 16.6666%; }

  .col-lg-3 {
    width: 25%; }

  .col-lg-4 {
    width: 33.3333%; }

  .col-lg-5 {
    width: 41.6666%; }

  .col-lg-6 {
    width: 50%; }

  .col-lg-7 {
    width: 58.3333%; }

  .col-lg-8 {
    width: 66.6666%; }

  .col-lg-9 {
    width: 75%; }

  .col-lg-10 {
    width: 83.3333%; }

  .col-lg-11 {
    width: 91.66667%; }

  .col-lg-12 {
    width: 100%; }

  .list-lg-i2 > li {
    width: 48%; }
    .list-lg-i2 > li:nth-child(2n) {
      margin-right: 0; }

  .list-lg-i3 > li {
    width: 32.5%;
    margin-right: 1.2%; }
    .list-lg-i3 > li:nth-child(3n) {
      margin-right: 0; }

  .list-lg-i4 > li {
    width: 23%;
    margin-right: 1.2%; }
    .list-lg-i4 > li:nth-child(4n) {
      margin-right: 0; }

  .list-lg-i5 > li {
    width: 19%;
    margin-right: 1.2%; }
    .list-lg-i5 > li:nth-child(5n) {
      margin-right: 0; }

  .list-lg-i6 > li {
    width: 15.6666%;
    margin-right: 1.2%; }
    .list-lg-i6 > li:nth-child(6n) {
      margin-right: 0; }

  #expertise-prize li, .product-list li {
    width: 240px;
    margin-right: 12px; }
    #expertise-prize li .img-thumb, .product-list li .img-thumb {
      width: 240px;
      height: 240px; } }
/*==========================================
Tablet
==========================================*/
@media screen and (max-width: 1024px) and (min-width: 769px) {
  #join-us-top .col-xl-5 {
    padding-left: 25px; }

  #expertise-prize li, .product-list li {
    display: block;
    width: 240px;
    text-align: center;
    margin-right: 9px; }
    #expertise-prize li:nth-child(4n), .product-list li:nth-child(4n) {
      margin-right: 8px; }
    #expertise-prize li .img-thumb, .product-list li .img-thumb {
      width: 240px;
      height: 240px; }

  .wrap-inner {
    width: 748px; }

  .col-md-1 {
    width: 8.3333%; }

  .col-md-2 {
    width: 16.6666%; }

  .col-md-3 {
    width: 25%; }

  .col-md-4 {
    width: 33.3333%; }

  .col-md-5 {
    width: 41.6666%; }

  .col-md-6 {
    width: 50%; }

  .col-md-7 {
    width: 58.3333%; }

  .col-md-8 {
    width: 66.6666%; }

  .col-md-9 {
    width: 75%; }

  .col-md-10 {
    width: 83.3333%; }

  .col-md-11 {
    width: 91.66667%; }

  .col-md-12 {
    width: 100%; }

  .list-md-i2 > li {
    width: 48%; }
    .list-md-i2 > li:nth-child(even) {
      float: right; }

  .list-md-i3 > li {
    width: 32.5%;
    margin-right: 1.2%; }
    .list-md-i3 > li:nth-child(3n) {
      margin-right: 0; }

  .list-md-i4 > li {
    width: 23%;
    margin-right: 1.2%; }
    .list-md-i4 > li:nth-child(4n) {
      margin-right: 0; }

  .list-md-i5 > li {
    width: 19%;
    margin-right: 1.2%; }
    .list-md-i5 > li:nth-child(5n) {
      margin-right: 0; }

  .list-md-i6 > li {
    width: 15.6666%;
    margin-right: 1.2%; }
    .list-md-i6 > li:nth-child(6n) {
      margin-right: 0; } }
/*==========================================
Tablet - Mobile
==========================================*/
@media screen and (max-width: 1499px) {
.mfp-content {
  width: 90% !important;
  height: 600px;
}
}
@media screen and (max-width: 1024px) {
    .animate-creator-major-button-div{width: initial!important;}
    .animate-creator-button-fullscreen{display: none !important;}
  #patent-list li h3 {
    font-size: 16px;
    line-height: 24px; }

  #detail-big-image {
    max-width: 400px;
    margin: 0 auto; }

  #news .news-list li .img-thumb {
    width: 280px; }
  #news .news-list li figcaption {
    width: calc(100% - 280px); }

  .inner-page {
    margin-top: 60px; }

  #home-news .news-list li figcaption {
    padding: 30px 15px 15px 15px; }

  .wrap-inner.wrap-more {
    padding: 0 20px; }

  #home-banner {
    height: 400px; }

  #banner-home-text {
    top: calc(50% - 110px);
    left: 10%;
    width: 437px;
    height: 435px;
    background-size: 83%;
    transform: scale(0.5);
    -webkit-transform: scale(0.5);
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0; }
    #banner-home-text .btn-down {
      width: 144px;
      height: 144px; }
    #banner-home-text h1 {
      font-size: 50px;
      line-height: 60px;
      padding: 100px 0 0 25px; }
      #banner-home-text h1 span {
        font-size: 40px;
        line-height: 50px;
        padding-left: 50px; }

  h1, .undoreset h1 {
    font-size: 32px;
    line-height: 40px;
    margin: 0; }

  h2, .undoreset h2 {
    font-size: 24px;
    line-height: 40px;
    margin: 0 0 10px 0; }

  h3, .undoreset h3 {
    font-size: 18px;
    line-height: 30px;
    margin: 0; }

  p, .undoreset p {
    font-size: 16px;
    line-height: 24px;
    margin: 0 0 20px 0; }

  .font-xl {
    font-size: 18px;
    line-height: 30px; }

  .font-lg {
    font-size: 17px;
    line-height: 30px; }

  .tablet-show, .tablet-block {
    display: block; }

  .tablet-hide {
    display: none; }

  header {
    height: 60px;
    padding: 0;
    background-color: #6c7a56; }
    header.scrolled {
      height: 60px;
      padding: 0;
      background-color: #6c7a56; }
    header .wrap, header.scrolled .wrap {
      width: 100%;
      padding: 0 20px !important; }
    header #head-right nav, header.scrolled #head-right nav {
      /*display:none;*/ }
    header .main-logo, header.scrolled .main-logo {
      margin-top: 10px;
      width: 160px; }
    header .lang-bar, header.scrolled .lang-bar {
      position: fixed;
      top: 15px;
      right: 50px;
      background: url("../images/icons/icon_lang02.png") no-repeat left center !important; }
    header .lang-bar li, header.scrolled .lang-bar li {
      padding: 0 5px; }
    header .lang-bar a, header.scrolled .lang-bar a {
      font-size: 16px;
      color: #fff !important; }
    header .lang-bar a.selected, header.scrolled .lang-bar a.selected {
      color: #add865 !important; }
    header nav, header.scrolled nav {
      top: 60px;
      background-color: rgba(255, 255, 255, 0.9);
      height: calc(100% - 60px);
      width: 300px;
      position: fixed;
      top: 60px;
      right: -300px;
      box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.1);
      transition: 0.4s;
      -webkit-transition: 0.4s; }
    header nav.show, header.scrolled nav.show {
      right: 0; }
    header nav div, header.scrolled nav div {
      width: 100%;
      padding: 0 20px;
      margin: 0; }
    header nav div a, header.scrolled nav div a {
      display: block;
      padding: 10px 0;
      color: #12877b;
      text-shadow: none; }
    header nav.show, header.scrolled nav.show {
      display: block; }

  .page-container {
    margin-top: 60px; }

  #home-contact .icon {
    padding: 40px; }
    #home-contact .icon img {
      width: 50px; }
  #home-contact .col-xl-6 {
    margin-bottom: 30px; }

  .banner-container {
    height: auto;
    padding-top: 310px;
    padding-bottom: 10px;
    background-size: auto 300px;
    background-position: top left;
    display: block;
    background-color: #1d3c34;
    /*padding-top:70px;*/ }
    .banner-container .banner-text {
      padding-left: 20px; }

  #home-banner.banner-container {
    padding-top: 0; }
  #home-banner .swiper-button-prev, #home-banner .swiper-button-next {
    transform: scale(0.4);
    -webkit-transform: scale(0.4); }
  #home-banner .swiper-button-prev {
    left: 15px; }
  #home-banner .swiper-button-next {
    right: 15px; }

  .expertise-features li {
    width: 300px;
    vertical-align: top;
    margin-bottom: 20px; }

  .inner-content {
    padding: 30px 0 0 0; }
    .inner-content article {
      width: 100%;
      margin: 0; }

  .inner-top {
    padding: 0 0 40px 0; }

  .inner-section {
    padding: 40px 0; }

  .technology-section .technology-photo {
    padding: 0px;
    margin-bottom: 30px; }
  .technology-section .technology-text {
    padding: 0 25px; }
    .technology-section .technology-text ul {
      margin-top: 20px; }
      .technology-section .technology-text ul li {
        font-size: 16px;
        line-height: 24px; }

  .iso-list li img {
    width: 80%; }

  .sidebar {
    position: static;
    padding: 10px 0 0 20px; }
    .sidebar li {
      margin: 0;
      width: 100%; }
      .sidebar li a {
        font-size: 16px;
        padding: 0 15px;
        line-height: 32px;
        height: auto;
        text-align: left;
        padding-left: 10px;
        border-bottom: 0;
        border-left: 2px solid transparent; }
        .sidebar li a:after {
          display: none; }
        .sidebar li a.selected {
          border-left: 2px solid #add865; }

  #back-top {
    margin: 0 auto; }

  .about-us-list li {
    margin: 0 20px; }
    .about-us-list li .circle {
      width: 180px;
      height: 180px;
      line-height: 180px;
      font-size: 48px;
      background-position: top 20px center; }
    .about-us-list li:nth-last-child(1) {
      clear: both;
      display: block;
      margin: 0 auto; }
      .about-us-list li:nth-last-child(1) .circle {
        display: inline-block;
        width: 240px;
        height: 240px;
        line-height: 240px;
        font-size: 64px; }

  #about-logo {
    width: 200px;
    height: 200px;
    line-height: 200px;
    /*margin-bottom:30px;*/ }
    #about-logo img {
      width: 160px; }

  #video1 {
    width: 100%; }

  .corporate-circle {
    width: 300px;
    height: 300px;
    margin: 0 auto 30px auto; }
    .corporate-circle h2 {
      line-height: 300px;
      font-size: 36px; }

  .our-mission-list li {
    line-height: 44px;
    padding-left: 0 !important;
    font-size: 18px; }
    .our-mission-list li span {
      font-size: 44px;
      padding-right: 20px; }

  #corporate-slider-right {
    padding-left: 0;
    margin-top: 30px; }

  #charity-list li {
    /*display:block;*/
    /*float:left;*/
    width: 49%;
    clear: both; }
    #charity-list li:nth-child(even) {
      float: right;
      clear: right; }

  #home-news .news-list li {
    width: calc( (100% - 40px) / 3 );
    margin-right: 20px; }

  footer {
    height: auto; }
    footer #footer-nav {
      margin: 30px 0;
      width: 100%;
      text-align: center; }
      footer #footer-nav li {
        margin: 0 10px; }
    footer #social-nav {
      width: 100%;
      text-align: center; }
      footer #social-nav li {
        display: inline-block;
        float: none; }
    footer .copyright {
      margin-top: 30px;
      text-align: center; }

  #about-timeline li .img-thumb {
    width: 120px;
    height: 120px; }
  #about-timeline li figcaption {
    padding-top: 5px;
    width: calc(100% - 120px); }
    #about-timeline li figcaption p {
      text-align: left; }

  .organization-slider {
    margin-bottom: 20px; }

  #our-mission, #our-vision {
    height: auto;
    padding: 60px 0; }

  .lang-en #banner-home-text {
    top: calc(50% - 110px);
    left: 10%;
    width: 437px;
    height: 435px;
    background-size: 83%;
    transform: scale(0.5);
    -webkit-transform: scale(0.5);
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0; }
    .lang-en #banner-home-text .btn-down {
      width: 144px;
      height: 144px; }
    .lang-en #banner-home-text h1 {
      font-size: 40px;
      line-height: 50px;
      padding: 100px 0 0 25px; }
      .lang-en #banner-home-text h1 span {
        font-size: 28px;
        line-height: 40px;
        padding-left: 50px; } }
/*==========================================
NOT Tablet
==========================================*/
@media screen and (min-width: 1024px) {
  .desktop-show {
    display: block !important; } }
/*==========================================
Small Tablet
==========================================*/
@media screen and (max-width: 768px) {
  #patent-list li .img-thumb {
    margin-bottom: 20px; }
  #patent-list li .col-xl-8 {
    padding: 0; }

  #product-detail .col-xl-6 {
    padding: 0; }

  #our-mission, #our-vision {
    height: auto;
    padding: 30px 0; }

  .technology-section .technology-photo {
    padding-left: 0px; }

  #expertise-top .wrap-inner > .col-xl-5 {
    padding: 0;
    margin-bottom: 20px; }

  #about-timeline li {
    width: calc(100% - 10px);
    margin-bottom: 40px;
    padding: 10px;
    background-color: white; }
    #about-timeline li .img-thumb {
      width: 120px;
      height: 120px; }
    #about-timeline li figcaption {
      width: calc(100% - 120px);
      padding: 0; }

  footer {
    height: auto; }
    footer #footer-nav {
      margin-top: 30px; }
      footer #footer-nav li {
        float: left;
        display: block;
        width: 50%;
        margin: 0 0 20px 0; }
    footer #social-nav {
      width: 100%;
      text-align: center; }
      footer #social-nav li {
        display: inline-block;
        float: none; }
    footer .copyright {
      margin-top: 30px;
      text-align: center; }

  #home-news .news-list li {
    width: 100%;
    margin: 0 0 30px 0; }

  #contact-enquiry .table-tr {
    margin-bottom: 0; }
    #contact-enquiry .table-tr > div {
      width: 100%;
      margin-bottom: 20px;
      margin-left: 0 !important; }
    #contact-enquiry .table-tr > input, #contact-enquiry .table-tr > textarea {
      margin-bottom: 20px; }

  #contact-info li {
    width: 100%;
    margin-bottom: 20px; }
    #contact-info li:nth-last-child(1) {
      margin: 0; }
    #contact-info li .circle {
      float: left;
      padding: 10px; }
    #contact-info li h3, #contact-info li p {
      width: calc(100% - 70px);
      float: right;
      text-align: left; }
    #contact-info li h3 {
      font-weight: 600; }

  .jobs-list li .job-title {
    padding: 10px 15px; }
  .jobs-list li .job-content {
    padding: 15px; }

  #join-benefit li {
    width: calc(100% / 2 - 4px);
    margin-bottom: 30px;
    vertical-align: top; }
    #join-benefit li .circle {
      margin-bottom: 10px;
      padding: 25px; }

  #join-us-top .col-xl-5 {
    padding: 0; }

  .div-table .table-tr {
    padding-bottom: 15px;
    margin-bottom: 15px; }
    .div-table .table-tr > div {
      width: 100% !important;
      padding: 0;
      text-align: left !important; }

  #expertise-prize li, .product-list li {
    width: calc(50% - 10px);
    margin: 0 0 30px 0;
    float: left; }
    #expertise-prize li .img-thumb, .product-list li .img-thumb {
      width: 100%;
      height: auto; }
    #expertise-prize li:nth-child(even), .product-list li:nth-child(even) {
      float: right;
      margin-left: 20px; }

  .wrap-inner, .wrap {
    width: 100%;
    padding: 0 20px; }

  .tablet-show, .tablet-block, .mobile-show, .mobile-block {
    display: block; }

  .tablet-hide, .mobile-hide {
    display: none; }

  .col-sm-1 {
    width: 8.3333%; }

  .col-sm-2 {
    width: 16.6666%; }

  .col-sm-3 {
    width: 25%; }

  .col-sm-4 {
    width: 33.3333%; }

  .col-sm-5 {
    width: 41.6666%; }

  .col-sm-6 {
    width: 50%; }

  .col-sm-7 {
    width: 58.3333%; }

  .col-sm-8 {
    width: 66.6666%; }

  .col-sm-9 {
    width: 75%; }

  .col-sm-10 {
    width: 83.3333%; }

  .col-sm-11 {
    width: 91.66667%; }

  .col-sm-12 {
    width: 100%; }

  .list-sm-i1 > li {
    width: 100%;
    margin-right: 0; }

  .list-sm-i2 > li {
    width: 48%;
    margin-right: 4%; }
    .list-sm-i2 > li:nth-child(even) {
      float: right; }
  .list-sm-i2.list-lg-i3 > li:nth-child(3n) {
    margin-right: 4%; }
  .list-sm-i2.list-lg-i3 > li:nth-child(2n) {
    margin-right: 0%; }

  .list-sm-i3 > li {
    width: 32.5%;
    margin-right: 1.2%; }
    .list-sm-i3 > li:nth-child(3n) {
      margin-right: 0; }

  .list-sm-i4 > li {
    width: 23%;
    margin-right: 1.2%; }
    .list-sm-i4 > li:nth-child(4n) {
      margin-right: 0; }

  .list-sm-i5 > li {
    width: 19%;
    margin-right: 1.2%; }
    .list-sm-i5 > li:nth-child(5n) {
      margin-right: 0; }

  .list-sm-i6 > li {
    width: 15.6666%;
    margin-right: 1.2%; }
    .list-sm-i6 > li:nth-child(6n) {
      margin-right: 0; }

  .list-sm-i2 > li {
    width: 48%; }
    .list-sm-i2 > li:nth-child(2n) {
      margin-right: 0; }

  .list-sm-i3 > li {
    width: 32.5%;
    margin-right: 1.2%; }
    .list-sm-i3 > li:nth-child(3n) {
      margin-right: 0; }

  .list-sm-i4 > li {
    width: 23%;
    margin-right: 1.2%; }
    .list-sm-i4 > li:nth-child(4n) {
      margin-right: 0; }

  .list-sm-i5 > li {
    width: 19%;
    margin-right: 1.2%; }
    .list-sm-i5 > li:nth-child(5n) {
      margin-right: 0; }

  .list-sm-i6 > li {
    width: 15.6666%;
    margin-right: 1.2%; }
    .list-sm-i6 > li:nth-child(6n) {
      margin-right: 0; }

  #corporate-prize li {
    width: 100%; }

  #news .news-list li {
    padding: 15px; }
    #news .news-list li .img-thumb {
      width: 100%; }
    #news .news-list li figcaption {
      width: 100%;
      padding: 0 0 20px 0; }

  footer #footer-nav {
    display: none; }

  #social-nav {
    margin-bottom: 30px; } }
/*==========================================
Mobile
==========================================*/
@media screen and (max-width: 480px) {
  .banner-container {
    background-position: top center; }

  .filter-bar .select-date {
    padding-top: 30px;
    padding-left: 0;
    background-position: top center; }
    .filter-bar .select-date span {
      margin-right: 10px; }
    .filter-bar .select-date select {
      width: calc(100% - 80px);
      margin-bottom: 10px; }
  .filter-bar .btn-style01 {
    padding: 0 10px; }
  .filter-bar .fl-right {
    width: 100%;
    text-align: center; }

  .paging-nav {
    margin: 0 0 20px 0; }

  #expertise-prize li, .product-list li {
    width: 100%;
    margin: 0 0 30px 0; }
    #expertise-prize li .img-thumb, .product-list li .img-thumb {
      width: auto;
      margin: 0 auto 10px auto; }
    #expertise-prize li:nth-child(even), .product-list li:nth-child(even) {
      margin-left: 0px; }

  .list-xs-i1 > li {
    width: 100%;
    margin-right: 0%; } 
    
    .mfp-content {
    height: 500px;
    }
  
}

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