@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css);
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-family: 'Roboto','Noto Sans TC', sans-serif !important;
  font: inherit;
  vertical-align: baseline; }

html {
  font-size: 16px; }

html * {
  font-size: 1rem; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

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

table {
  border-collapse: collapse;
  border-spacing: 0; }

.custom-container-width {
  max-width: 1230px; }

a, a:hover {
  color: #000;
  text-decoration: none; }

.header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100vh;
  max-height: 160px;
  position: -webkit-sticky;
  position: sticky;
  top: -1px;
  left: 0;
  width: 100%;
  z-index: 100;
  background: #0d213c;
  -webkit-transition: all .5s linear;
  -o-transition: all .5s linear;
  transition: all .5s linear; }
  .header.active {
    height: 100vh;
    max-height: 120px;
    -webkit-box-shadow: 0 5px 10px #00000099;
    box-shadow: 0 5px 10px #00000099;
    background: #0d213c; }
    .header.active .menu .menuLink ul li .pageLink.dropDownLink ~ .dropDown {
      padding-top: 50px; }
  .header .container {
    max-width: 1500px;
    margin: 0 auto; }
  .header .menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    .header .menu #menu-toggle {
      display: none;
      width: 60px;
      height: 60px;
      position: relative;
      cursor: pointer;
      border-radius: 5px; }
      .header .menu #menu-toggle span {
        display: block;
        background: #566973;
        border-radius: 2px; }
      .header .menu #menu-toggle #hamburger {
        position: absolute;
        height: 100%;
        width: 100%; }
        .header .menu #menu-toggle #hamburger span {
          position: relative;
          top: 4px;
          left: 10px;
          width: 40px;
          height: 4px;
          margin: 10px 0;
          -webkit-transition: .25s ease-in-out;
          -o-transition: .25s ease-in-out;
          transition: .25s ease-in-out;
          -webkit-box-sizing: border-box;
          box-sizing: border-box; }
          .header .menu #menu-toggle #hamburger span:nth-child(1) {
            -webkit-transition-delay: .5s;
            -o-transition-delay: .5s;
            transition-delay: .5s; }
          .header .menu #menu-toggle #hamburger span:nth-child(2) {
            -webkit-transition-delay: .625s;
            -o-transition-delay: .625s;
            transition-delay: .625s; }
          .header .menu #menu-toggle #hamburger span:nth-child(3) {
            -webkit-transition-delay: .75s;
            -o-transition-delay: .75s;
            transition-delay: .75s; }
      .header .menu #menu-toggle #cross {
        position: absolute;
        height: 100%;
        width: 100%;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg); }
        .header .menu #menu-toggle #cross span {
          -webkit-transition: .25s ease-in-out;
          -o-transition: .25s ease-in-out;
          transition: .25s ease-in-out;
          -webkit-box-sizing: border-box;
          box-sizing: border-box; }
          .header .menu #menu-toggle #cross span:nth-child(1) {
            height: 0%;
            width: 4px;
            position: absolute;
            top: 20%;
            left: 28px;
            -webkit-transition-delay: 0s;
            -o-transition-delay: 0s;
            transition-delay: 0s; }
          .header .menu #menu-toggle #cross span:nth-child(2) {
            width: 0%;
            height: 4px;
            position: absolute;
            left: 20%;
            top: 28px;
            -webkit-transition-delay: .25s;
            -o-transition-delay: .25s;
            transition-delay: .25s; }
    .header .menu #menu-toggle.active ~ .mobileMenuLink {
      max-height: 100vh; }
    .header .menu #menu-toggle.active #hamburger span {
      width: 0%; }
      .header .menu #menu-toggle.active #hamburger span:nth-child(1) {
        -webkit-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s; }
      .header .menu #menu-toggle.active #hamburger span:nth-child(2) {
        -webkit-transition-delay: .125s;
        -o-transition-delay: .125s;
        transition-delay: .125s; }
      .header .menu #menu-toggle.active #hamburger span:nth-child(3) {
        -webkit-transition-delay: .25s;
        -o-transition-delay: .25s;
        transition-delay: .25s; }
    .header .menu #menu-toggle.active #cross span:nth-child(1) {
      height: 60%;
      -webkit-transition-delay: .625s;
      -o-transition-delay: .625s;
      transition-delay: .625s; }
    .header .menu #menu-toggle.active #cross span:nth-child(2) {
      width: 60%;
      -webkit-transition-delay: .375s;
      -o-transition-delay: .375s;
      transition-delay: .375s; }
    .header .menu .menuLink ul {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
      .header .menu .menuLink ul li {
        position: relative; }
        .header .menu .menuLink ul li:last-of-type .pageLink {
          margin-right: 0; }
        .header .menu .menuLink ul li .pageLink {
          position: relative;
          margin-right: 50px;
          font-size: 1.2rem;
          color: #00ff55; }
          .header .menu .menuLink ul li .pageLink:hover, .header .menu .menuLink ul li .pageLink.active {
            padding-bottom: 20px;
            border-bottom: 3px solid; }
          .header .menu .menuLink ul li .pageLink.dropDownLink {
            padding-right: 25px;
            cursor: pointer; }
            .header .menu .menuLink ul li .pageLink.dropDownLink:hover ~ .dropDown, .header .menu .menuLink ul li .pageLink.dropDownLink.active ~ .dropDown {
              max-height: 100vh; }
            .header .menu .menuLink ul li .pageLink.dropDownLink ~ .dropDown {
              position: absolute;
              -webkit-transition: .3s;
              -o-transition: .3s;
              transition: .3s;
              padding-top: 70px;
              max-height: 0;
              overflow: hidden;
              -webkit-transition: .5s linear;
              -o-transition: .5s linear;
              transition: .5s linear; }
              .header .menu .menuLink ul li .pageLink.dropDownLink ~ .dropDown:hover {
                max-height: 100vh; }
              .header .menu .menuLink ul li .pageLink.dropDownLink ~ .dropDown a {
                display: block;
                width: 250px;
                padding: 17px 0;
                text-align: center;
                font-size: 1.25rem;
                color: #0d213c;
                background: #e8ecf0;
                -webkit-transition: .3s ease-in-out;
                -o-transition: .3s ease-in-out;
                transition: .3s ease-in-out; }
                .header .menu .menuLink ul li .pageLink.dropDownLink ~ .dropDown a:hover, .header .menu .menuLink ul li .pageLink.dropDownLink ~ .dropDown a.active {
                  color: #ffffff;
                  background: #0059a5; }
    .header .menu .menuLink .arrow {
      position: absolute;
      right: 0;
      display: inline-block;
      width: 12px;
      height: 12px;
      border-right: 2px;
      border-bottom: 2px;
      border-style: solid;
      border-color: #00ff55;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
    .header .menu .mobileMenuLink {
      display: none;
      position: absolute;
      width: 100%;
      top: 100%;
      left: 0;
      background: #0d213c;
      max-height: 0;
      overflow: hidden;
      -webkit-transition: .8s ease-in-out;
      -o-transition: .8s ease-in-out;
      transition: .8s ease-in-out; }
      .header .menu .mobileMenuLink .pageLink {
        display: block;
        padding: 15px 0 15px 10px;
        color: #00ff55; }
        .header .menu .mobileMenuLink .pageLink.active {
          border-bottom: 1px solid #00ff55; }
      .header .menu .mobileMenuLink .dropDownLink.active ~ .dropDown {
        max-height: 100vh; }
      .header .menu .mobileMenuLink .dropDown {
        max-height: 0;
        overflow: hidden;
        -webkit-transition: .8s ease-in-out;
        -o-transition: .8s ease-in-out;
        transition: .8s ease-in-out; }
        .header .menu .mobileMenuLink .dropDown a {
          display: block;
          padding: 15px 0 15px 25px;
          color: #00ff55; }
          .header .menu .mobileMenuLink .dropDown a.active {
            background: #6d6d6d; }

@media (max-width: 992px) {
  .header {
    max-height: 120px; }
    .header .menu .menuLink {
      display: none; }
    .header .menu #menu-toggle {
      display: block; }
    .header .menu .mobileMenuLink {
      display: block; } }

.footer .ft-company {
  padding: 43px 0;
  background: #0d213c; }
  .footer .ft-company .ft-company-top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 20px; }
    .footer .ft-company .ft-company-top p {
      margin-left: 18px;
      color: #fff;
      font-size: 1.85rem; }
  .footer .ft-company .ft-company-bottom {
    text-align: center; }
    .footer .ft-company .ft-company-bottom .link {
      color: #fff;
      font-size: 1.25rem;
      line-height: 1.5;
      margin-right: 40px; }

.footer .ft-copyright {
  line-height: 45px;
  background: #3c3c46; }
  .footer .ft-copyright p {
    color: #ffffff;
    font-size: 1.25rem;
    text-align: center; }

@media (max-width: 992px) {
  .footer .ft-company .ft-company-top p {
    font-size: 1.4rem; }
  .footer .ft-copyright p {
    font-size: 1rem; } }

@media (max-width: 768px) {
  .footer .ft-company .ft-company-top {
    display: block;
    text-align: center; }
    .footer .ft-company .ft-company-top img {
      margin-bottom: 10px; }
  .footer .ft-company .ft-company-bottom .link {
    display: block;
    margin-right: 0; } }

.indexPage {
  position: relative; }
  .indexPage .container {
    max-width: 1500px;
    margin: 0 auto; }
  .indexPage .header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0;
    z-index: 100;
    background: none; }
    .indexPage .header.active {
      margin-top: 0;
      -webkit-box-shadow: 0 5px 10px #00000099;
      box-shadow: 0 5px 10px #00000099;
      background: #0d213c; }
    .indexPage .header .menu .menuLink ul li .pageLink.dropDownLink ~ .dropDown {
      padding-top: 30px; }
    .indexPage .header.active .menu .menuLink ul li .pageLink.dropDownLink ~ .dropDown {
      padding-top: 50px; }
  .indexPage .indexBanner {
    position: relative; }
    .indexPage .indexBanner .owl-nav {
      display: none; }
    .indexPage .indexBanner .owl-dots {
      position: absolute;
      left: 50%;
      bottom: 50px;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%); }
      .indexPage .indexBanner .owl-dots button {
        width: 45px;
        height: 10px;
        background: #0d213c; }
        .indexPage .indexBanner .owl-dots button.active {
          background: #00ff55; }
    .indexPage .indexBanner .item .mobile-bg {
      display: none; }
    .indexPage .indexBanner .item .text {
      position: absolute;
      top: 0;
      left: 0;
      margin: 15% 0 0 11%;
      z-index: 15;
      -webkit-transition: .5s ease-in-out;
      -o-transition: .5s ease-in-out;
      transition: .5s ease-in-out; }
      .indexPage .indexBanner .item .text .text-1 {
        width: 100%;
        max-width: 463px;
        margin-bottom: 15px;
        -webkit-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out; }
      .indexPage .indexBanner .item .text .text-2 {
        width: 100%;
        max-width: 615px;
        margin-bottom: 10px;
        -webkit-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out; }
      .indexPage .indexBanner .item .text .text-3 {
        width: 100%;
        max-width: 308px;
        margin-bottom: 20px;
        -webkit-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out; }
      .indexPage .indexBanner .item .text .img-1 {
        position: absolute;
        top: 65%;
        right: 5%;
        width: 100%;
        max-width: 245px;
        -webkit-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out; }
      .indexPage .indexBanner .item .text .img-2 {
        width: 100%;
        max-width: 304px;
        -webkit-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out; }
    .indexPage .indexBanner .bannerLine {
      display: block;
      position: absolute;
      left: 50%;
      bottom: -17.5px;
      z-index: 1;
      width: 100%;
      max-width: 1200px;
      height: 35px;
      background: #d2d2d2;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%); }
      .indexPage .indexBanner .bannerLine::before {
        content: '';
        position: absolute;
        left: 0;
        z-index: 100;
        display: block;
        width: 107px;
        height: 35px;
        background: #00ff55; }
      .indexPage .indexBanner .bannerLine p {
        color: #fff;
        padding-left: 133px;
        line-height: 35px; }
  .indexPage .index-item-1 {
    padding-bottom: 140px;
    background: #0d213c; }
    .indexPage .index-item-1 .indexProSlider .owl-nav button {
      position: absolute;
      top: 35%;
      text-align: center; }
      .indexPage .index-item-1 .indexProSlider .owl-nav button:focus {
        outline: none; }
      .indexPage .index-item-1 .indexProSlider .owl-nav button span {
        display: block;
        width: 70px;
        height: 70px;
        line-height: 70px;
        font-size: 4rem;
        color: #00ff55;
        background-color: #0d213c;
        border-radius: 100%;
        opacity: 0.5; }
      .indexPage .index-item-1 .indexProSlider .owl-nav button.owl-prev {
        left: 18px; }
      .indexPage .index-item-1 .indexProSlider .owl-nav button.owl-next {
        right: 18px; }
    .indexPage .index-item-1 .indexProSlider .owl-dots {
      display: none; }
    .indexPage .index-item-1 .item-1-title {
      padding: 108px 0 40px;
      text-align: center;
      font-weight: bold;
      color: #00ff55; }
      .indexPage .index-item-1 .item-1-title p {
        font-size: 2.25rem; }
    .indexPage .index-item-1 .item {
      display: block;
      margin-bottom: 28px; }
      .indexPage .index-item-1 .item:hover .img {
        background-size: 120%;
        background-origin: bottom; }
      .indexPage .index-item-1 .item:hover .text {
        background: #00ff55; }
      .indexPage .index-item-1 .item .zh-img {
        padding-bottom: 80%; }
      .indexPage .index-item-1 .item .img {
        width: 100%;
        padding-bottom: 80%;
        -webkit-transition: all .2s linear;
        -o-transition: all .2s linear;
        transition: all .2s linear; }
        .indexPage .index-item-1 .item .img-zh-1 {
          background: url("../images/products/Packaging_Material/img27.webp") no-repeat;
          background-size: 100%; }
        .indexPage .index-item-1 .item .img-zh-2 {
          background: url("../images/products/Packaging_Material/img10.png") no-repeat;
          background-size: 100%; }
        .indexPage .index-item-1 .item .img-zh-3 {
          background: url("../images/products/Packaging_Material/img06.png") no-repeat;
          background-size: 100%; }
        .indexPage .index-item-1 .item .img-zh-4 {
          background: url("../images/products/Packaging_Material/img02.png") no-repeat;
          background-size: 100%; }
        .indexPage .index-item-1 .item .img-zh-5 {
          background: url("../images/products/Packaging_Material/img26.webp") no-repeat;
          background-size: 100%; }
        .indexPage .index-item-1 .item .img-1 {
          background: url("../images/index/item1-2.png") no-repeat;
          background-size: 110%; }
        .indexPage .index-item-1 .item .img-2 {
          background: url("../images/index/item1-1.png") no-repeat;
          background-size: 110%; }
        .indexPage .index-item-1 .item .img-3 {
          background: url("../images/index/item1-3.png") no-repeat;
          background-size: 110%; }
        .indexPage .index-item-1 .item .img-4 {
          background: url("../images/index/item1-4.png") no-repeat;
          background-size: 110%; }
        .indexPage .index-item-1 .item .img-5 {
          background: url("../images/index/item1-5.png") no-repeat;
          background-size: 110%; }
        .indexPage .index-item-1 .item .img-6 {
          background: url("../images/index/item1-6.png") no-repeat;
          background-size: 110%; }
        .indexPage .index-item-1 .item .img img {
          width: 100%;
          max-width: 382px; }
      .indexPage .index-item-1 .item .text {
        line-height: 60px;
        background: #d8d8d8;
        text-align: center;
        -webkit-transition: all .3s linear;
        -o-transition: all .3s linear;
        transition: all .3s linear; }
        .indexPage .index-item-1 .item .text p {
          font-size: 1.25rem;
          color: #0d213c; }
  .indexPage .index-item-2 {
    position: relative;
    width: 100%;
    height: 380px;
    text-align: center;
    background: url(../images/index/item-2-bg.png) center 20px;
    background-attachment: fixed; }
    .indexPage .index-item-2::before {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 380px;
      background-color: rgba(0, 89, 165, 0.5); }
    .indexPage .index-item-2 p {
      position: relative;
      z-index: 10;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      height: 380px;
      font-size: 2.5rem;
      color: #00ff55;
      font-style: italic; }

@media (max-width: 1650px) {
  .indexPage .indexBanner .item .text {
    margin: 15% 0 0 1%; } }

@media (max-width: 992px) {
  .indexPage .index-item-1 {
    padding-bottom: 80px; }
    .indexPage .index-item-1 .row {
      margin-left: 0; }
  .indexPage .header {
    position: -webkit-sticky;
    position: sticky;
    background: #0d213c; }
  .indexPage .indexBanner .owl-dots {
    display: none; }
  .indexPage .indexBanner .item .text .text-1 {
    max-width: 250px; }
  .indexPage .indexBanner .item .text .text-2 {
    max-width: 340px; }
  .indexPage .indexBanner .item .text .text-3 {
    max-width: 180px; }
  .indexPage .indexBanner .item .text .img-1 {
    max-width: 100px; }
  .indexPage .indexBanner .item .text .img-2 {
    max-width: 200px; }
  .indexPage .index-item-1 .item .text p {
    font-size: 1.4 rem; }
  .indexPage .index-item-1 .indexProSlider .owl-nav button.owl-prev {
    left: 0; }
  .indexPage .index-item-1 .indexProSlider .owl-nav button.owl-next {
    right: 0; }
  .indexPage .index-item-1 .indexProSlider .owl-nav button span {
    background-color: transparent; }
  .indexPage .index-item-2 {
    display: block;
    background: url(../images/index/item-2-bg.png) 36% -69px;
    background-attachment: fixed; } }

@media (max-width: 576px) {
  .indexPage .indexBanner .item .desktop-bg {
    display: none; }
    .indexPage .indexBanner .item .desktop-bg ~ .text {
      display: none; }
  .indexPage .indexBanner .item .mobile-bg {
    display: block; } }

.aboutPage .about-item1 {
  max-width: 1020px;
  text-align: center;
  margin: 83px auto 40px; }
  .aboutPage .about-item1 .text-1 {
    font-size: 3.1rem;
    color: #0059a5;
    line-height: 1.2;
    font-weight: bold; }
  .aboutPage .about-item1 .text-2 {
    padding-top: 58px;
    line-height: 1.8; }
    .aboutPage .about-item1 .text-2 p {
      font-size: 1.15rem;
      margin-bottom: 40px;
      color: #0d213c; }

.aboutPage .item1-img {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 150px; }
  .aboutPage .item1-img img {
    width: 100%;
    height: 100%;
    max-width: 1314px;
    max-height: 600px; }

.aboutPage .about-item2 {
  position: relative;
  text-align: center;
  background: url(../images/about/about-item2-img.png);
  background-attachment: fixed; }
  .aboutPage .about-item2 .container {
    margin: 0 auto; }
  .aboutPage .about-item2 .about-item2-text {
    padding: 150px 0 182px;
    text-align: center; }
    .aboutPage .about-item2 .about-item2-text h4 {
      margin-bottom: 18px;
      font-size: 3.1rem;
      font-weight: bold;
      color: #0059a5; }
    .aboutPage .about-item2 .about-item2-text h5 {
      margin: 0 8%;
      font-size: 1.25rem;
      line-height: 1.5;
      color: #0d213c; }

@media (min-width: 1200px) {
  .aboutPage .container {
    max-width: 1300px; } }

@media (max-width: 992px) {
  .aboutPage .about-item1 .text-1 {
    font-size: 2rem; }
  .aboutPage .about-item2 .about-item2-text h4 {
    font-size: 2rem; } }

.productsPage .products-item-1 {
  margin-top: 100px; }
  .productsPage .products-item-1 .item {
    display: block;
    margin-bottom: 70px; }
    .productsPage .products-item-1 .item:hover .img {
      background-size: 120%;
      background-origin: bottom; }
    .productsPage .products-item-1 .item:hover .text {
      background: #00ff55; }
    .productsPage .products-item-1 .item .img {
      width: 100%;
      padding-bottom: 130%;
      -webkit-transition: all .2s linear;
      -o-transition: all .2s linear;
      transition: all .2s linear; }
      .productsPage .products-item-1 .item .img-1 {
        background: url("../images/products/proImg-02.png") no-repeat;
        background-size: 110%; }
      .productsPage .products-item-1 .item .img-2 {
        background: url("../images/products/proImg-01.png") no-repeat;
        background-size: 110%; }
      .productsPage .products-item-1 .item .img-3 {
        background: url("../images/products/proImg-03.png") no-repeat;
        background-size: 110%; }
      .productsPage .products-item-1 .item .img-4 {
        background: url("../images/products/proImg-04.png") no-repeat;
        background-size: 110%; }
      .productsPage .products-item-1 .item .img-5 {
        background: url("../images/products/proImg-05.png") no-repeat;
        background-size: 110%; }
      .productsPage .products-item-1 .item .img img {
        width: 100%;
        max-width: 382px; }
    .productsPage .products-item-1 .item .text {
      line-height: 60px;
      background: #d8d8d8;
      text-align: center;
      -webkit-transition: all .3s linear;
      -o-transition: all .3s linear;
      transition: all .3s linear; }
      .productsPage .products-item-1 .item .text p {
        font-size: 1.25rem;
        color: #0d213c; }

@media (min-width: 1200px) {
  .productsPage .container {
    max-width: 1300px; } }

@media (min-width: 992px) {
  .productsPage .col-lg-4 {
    padding: 0px 40px; } }

.productsTypePage .productsTypePage-item-1 .typeName {
  padding-top: 25px;
  text-align: center; }
  .productsTypePage .productsTypePage-item-1 .typeName .text {
    font-size: 2.25rem;
    font-weight: bold;
    color: #0059a5; }

.productsTypePage .productsTypePage-item-1 .backLink {
  text-align: center; }
  .productsTypePage .productsTypePage-item-1 .backLink img {
    display: block;
    margin: 15px auto 8px; }
  .productsTypePage .productsTypePage-item-1 .backLink p {
    font-size: 1.25rem; }

.productsTypePage .productsTypePage-item-2 .container {
  padding: 0 9%;
  max-width: 100%; }

.productsTypePage .productsTypePage-item-2 .item {
  margin-bottom: 60px;
  text-align: center; }
  .productsTypePage .productsTypePage-item-2 .item:hover .text {
    background: #00ff55; }
  .productsTypePage .productsTypePage-item-2 .item img {
    width: 100%;
    max-width: 382px; }
  .productsTypePage .productsTypePage-item-2 .item .text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 60px;
    padding: 10px 16px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: #e8ecf0;
    -webkit-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out; }
    .productsTypePage .productsTypePage-item-2 .item .text h4 {
      font-size: 1.25rem;
      color: #0d213c; }

@media (min-width: 1200px) {
  .productsTypePage .container {
    max-width: 1300px; } }

@media (max-width: 992px) {
  .productsTypePage .productsTypePage-item-1 .typeName .text {
    font-size: 2rem; } }

.machinePage .machinePage-item-2 .machineImg {
  margin-top: 68px; }
  .machinePage .machinePage-item-2 .machineImg .machineImg-txt {
    margin: 20px 0 10px;
    text-align: center;
    font-size: 1.25rem;
    color: #0d213c; }

.machinePage .machinePage-item-2 .type01 .item {
  margin-bottom: 75px; }

.machinePage .machinePage-item-2 .type01 img {
  width: 100%; }

.machinePage .machinePage-item-2 .machineFitting {
  margin: 84px 0 62px; }
  .machinePage .machinePage-item-2 .machineFitting .item {
    max-width: 200px;
    border: solid 1px #00ff55; }
    .machinePage .machinePage-item-2 .machineFitting .item img {
      display: block; }

.machinePage .machinePage-item-3 {
  padding-top: 85px;
  background-color: #e8ecf0; }
  .machinePage .machinePage-item-3 .container {
    padding: 0 9%;
    max-width: 100%; }
  .machinePage .machinePage-item-3-content {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }
  .machinePage .machinePage-item-3 .sidebar {
    margin-bottom: 70px; }
    .machinePage .machinePage-item-3 .sidebar .proType {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      border-bottom: solid 1px #c8c8c8;
      padding: 10px 7px 10px 13px;
      background: #0d213c;
      cursor: pointer; }
      .machinePage .machinePage-item-3 .sidebar .proType.active {
        background: #00ff55; }
        .machinePage .machinePage-item-3 .sidebar .proType.active > p {
          color: #0d213c; }
        .machinePage .machinePage-item-3 .sidebar .proType.active .arrow {
          -webkit-transform: rotate(-45deg);
          -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
          margin: 12px 16px 0 0; }
        .machinePage .machinePage-item-3 .sidebar .proType.active ~ .allPro {
          max-height: 200vh; }
      .machinePage .machinePage-item-3 .sidebar .proType .txt {
        width: 82%;
        color: #ffffff;
        font-size: 1.25rem;
        line-height: 1.2; }
      .machinePage .machinePage-item-3 .sidebar .proType .arrow {
        width: 18px;
        height: 18px;
        -webkit-transform: rotate(135deg);
        -ms-transform: rotate(135deg);
        transform: rotate(135deg);
        margin: -8px 16px 0 0;
        -webkit-transform-origin: center;
        -ms-transform-origin: center;
        transform-origin: center;
        border-right: solid 3px #ffffff;
        border-top: solid 3px #ffffff;
        -webkit-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out; }
    .machinePage .machinePage-item-3 .sidebar .allPro {
      overflow: hidden;
      max-height: 0;
      background: #fff;
      -webkit-transition: .5s ease-in-out;
      -o-transition: .5s ease-in-out;
      transition: .5s ease-in-out; }
      .machinePage .machinePage-item-3 .sidebar .allPro a {
        display: block;
        padding: 16px 13px 14px 13px;
        border-bottom: 2px solid #c8c8c8;
        -webkit-transition: .3s ease-in-out;
        -o-transition: .3s ease-in-out;
        transition: .3s ease-in-out; }
        .machinePage .machinePage-item-3 .sidebar .allPro a:last-of-type {
          border-bottom: 0; }
        .machinePage .machinePage-item-3 .sidebar .allPro a p {
          font-size: 1.25rem;
          color: #0d213c; }
        .machinePage .machinePage-item-3 .sidebar .allPro a:hover {
          padding: 16px 13px 14px 30px; }
        .machinePage .machinePage-item-3 .sidebar .allPro a.active {
          font-weight: bold;
          border-bottom: 2px solid #0059a5; }
          .machinePage .machinePage-item-3 .sidebar .allPro a.active p {
            color: #0059a5; }
  .machinePage .machinePage-item-3 .introduction .introduction-item {
    margin-bottom: 60px; }
    .machinePage .machinePage-item-3 .introduction .introduction-item > h5 {
      margin-bottom: 36px;
      font-size: 1.25rem;
      line-height: 1.5;
      color: #0d213c; }
  .machinePage .machinePage-item-3 .introduction .introduction-title {
    margin-bottom: 32px;
    font-size: 2.25rem;
    font-weight: bold;
    color: #0d213c; }
  .machinePage .machinePage-item-3 .introduction .introduction-content {
    margin-bottom: 36px; }
    .machinePage .machinePage-item-3 .introduction .introduction-content li {
      font-size: 1.25rem;
      margin-bottom: 10px;
      color: #0d213c; }
  .machinePage .machinePage-item-3 .introduction .content-item {
    margin-bottom: 36px;
    padding-bottom: 40px;
    border-bottom: 1px solid #0d213c; }
    .machinePage .machinePage-item-3 .introduction .content-item h4,
    .machinePage .machinePage-item-3 .introduction .content-item h5,
    .machinePage .machinePage-item-3 .introduction .content-item li {
      font-size: 1.25rem;
      line-height: 1.5;
      color: #0d213c; }
    .machinePage .machinePage-item-3 .introduction .content-item h4 {
      margin-bottom: 25px;
      font-weight: bold;
      color: #0059a5; }
    .machinePage .machinePage-item-3 .introduction .content-item h5 {
      margin-bottom: 18px;
      margin-left: -10px; }
    .machinePage .machinePage-item-3 .introduction .content-item li {
      margin-left: -10px; }
    .machinePage .machinePage-item-3 .introduction .content-item .img {
      text-align: center; }
      .machinePage .machinePage-item-3 .introduction .content-item .img img {
        width: 100%; }
      .machinePage .machinePage-item-3 .introduction .content-item .img .img01 {
        max-width: 382px; }
      .machinePage .machinePage-item-3 .introduction .content-item .img .img02 {
        max-width: 173px; }
  .machinePage .machinePage-item-3 .introduction .specification table {
    width: 100%;
    text-align: center;
    border-bottom: solid 1px #979797; }
    .machinePage .machinePage-item-3 .introduction .specification table td,
    .machinePage .machinePage-item-3 .introduction .specification table th {
      border-right: solid 1px #979797; }
      .machinePage .machinePage-item-3 .introduction .specification table td:first-of-type,
      .machinePage .machinePage-item-3 .introduction .specification table th:first-of-type {
        max-width: 250px;
        padding-left: 25px;
        text-align: left; }
      .machinePage .machinePage-item-3 .introduction .specification table td:last-of-type,
      .machinePage .machinePage-item-3 .introduction .specification table th:last-of-type {
        border-right: 0; }
  .machinePage .machinePage-item-3 .introduction .specification thead {
    color: #fff;
    background: #0059a5; }
    .machinePage .machinePage-item-3 .introduction .specification thead th {
      padding: 4px 0;
      font-size: 1.25rem; }
  .machinePage .machinePage-item-3 .introduction .specification tbody tr:nth-child(odd) {
    background: #ffffff; }
  .machinePage .machinePage-item-3 .introduction .specification tbody tr:nth-child(even) {
    background: #e8ecf0; }
  .machinePage .machinePage-item-3 .introduction .specification tbody tr td {
    padding: 4px 0; }

@media (max-width: 1200px) {
  .machinePage .container {
    max-width: 1300px; }
  .machinePage .machinePage-item-3 .container {
    max-width: 1500px; } }

@media (max-width: 992px) {
  .machinePage .machinePage-item-3-content .sidebar {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    padding: 20px 0 35px;
    border-top: 2px solid #0d213c; }
    .machinePage .machinePage-item-3-content .sidebar .allPro a p {
      font-size: 1.4rem; }
  .machinePage .machinePage-item-3 .introduction .introduction-title {
    font-size: 1.75rem; } }

@media (max-width: 576px) {
  .machinePage .machinePage-item-3 .introduction .specification table {
    display: block;
    width: 100%;
    overflow-x: auto; }
    .machinePage .machinePage-item-3 .introduction .specification table td {
      padding: 10px !important; } }

.newsPage {
  height: 800px; }
  .newsPage .news-item-1 {
    margin-top: 120px; }
    .newsPage .news-item-1 .newsTitle {
      margin-bottom: 10px;
      color: #0059a5;
      font-size: 2.25rem;
      font-weight: bold; }
    .newsPage .news-item-1 .news-content {
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      padding-bottom: 30px;
      border-bottom: solid 1px #0d213c; }
      .newsPage .news-item-1 .news-content .newsText {
        line-height: 1.5;
        font-size: 1.25rem; }
      .newsPage .news-item-1 .news-content .img img {
        width: 100%;
        max-width: 284px; }
      .newsPage .news-item-1 .news-content .date {
        color: #0d213c;
        font-size: 1.25rem;
        text-align: right; }

@media (min-width: 1200px) {
  .newsPage .container {
    max-width: 1300px; } }

@media (max-width: 992px) {
  .newsPage .news-item-1 .newsTitle {
    font-size: 2rem; } }

@media (max-width: 768px) {
  .newsPage .news-item-1 {
    text-align: center; }
    .newsPage .news-item-1 .newsTitle {
      margin-bottom: 15px; }
    .newsPage .news-item-1 .news-content .newsText {
      margin-bottom: 15px; }
    .newsPage .news-item-1 .news-content .date {
      margin-top: 15px;
      text-align: center; } }

.contactPage .contact-item-1 {
  margin-top: 130px;
  padding-bottom: 150px; }
  .contactPage .contact-item-1 .row {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }
  .contactPage .contact-item-1 .coctent-left h4 {
    margin-bottom: 33px;
    font-size: 2.25rem;
    font-weight: bold;
    color: #0059a5; }
  .contactPage .contact-item-1 .coctent-left h5 {
    font-size: 1.25rem;
    color: #0d213c;
    line-height: 2.25; }
    .contactPage .contact-item-1 .coctent-left h5 span {
      font-size: 1.25rem;
      font-weight: bold; }
  .contactPage .contact-item-1 .coctent-left .map {
    margin-top: 50px; }
  .contactPage .contact-item-1 .coctent-right p {
    margin-bottom: 10px;
    font-size: 1.25rem;
    color: #0d213c; }
    .contactPage .contact-item-1 .coctent-right p span {
      font-size: 1.25rem;
      color: #ff0000; }
  .contactPage .contact-item-1 .coctent-right input {
    height: 55px; }
  .contactPage .contact-item-1 .coctent-right textarea {
    padding: 20px 0; }
  .contactPage .contact-item-1 .coctent-right input,
  .contactPage .contact-item-1 .coctent-right textarea {
    width: 100%;
    font-size: 1.25rem;
    padding-left: 15px;
    margin-bottom: 10px;
    border-radius: 8px;
    border: solid 1px #3c3c46; }
  .contactPage .contact-item-1 .coctent-right .inputSend {
    text-align: center; }
    .contactPage .contact-item-1 .coctent-right .inputSend .send {
      display: inline-block;
      text-align: center;
      padding: 16px 55px;
      font-size: 1.25rem;
      color: #0d213c;
      border-radius: 8px;
      background-color: #00ff55;
      cursor: pointer;
      -webkit-transition: .5s ease-in-out;
      -o-transition: .5s ease-in-out;
      transition: .5s ease-in-out; }
      .contactPage .contact-item-1 .coctent-right .inputSend .send:hover {
        color: #fff;
        background-color: #0059a5; }

@media (min-width: 1200px) {
  .contactPage .container {
    max-width: 1300px; } }

@media (max-width: 992px) {
  .contactPage .contact-item-1 .coctent-left h4 {
    font-size: 2rem; } }

.materialPage .materialPage-item .item-title {
  display: block;
  margin: 30px auto 50px;
  text-align: center;
  font-weight: bold;
  line-height: 1.7;
  font-size: 2.25rem;
  color: #0059a5; }

.materialPage .materialPage-item .item {
  display: block;
  text-align: center;
  margin-bottom: 40px; }
  .materialPage .materialPage-item .item .img {
    height: 300px;
    text-align: center; }
    .materialPage .materialPage-item .item .img:before {
      content: '';
      display: inline-block;
      height: 100%;
      vertical-align: middle; }
    .materialPage .materialPage-item .item .img .img {
      max-width: calc(100% - 6px);
      position: relative;
      display: inline-block;
      vertical-align: middle; }
    .materialPage .materialPage-item .item .img img {
      max-width: calc(100% - 6px);
      position: relative;
      display: inline-block;
      vertical-align: middle; }
    .materialPage .materialPage-item .item .img img {
      margin-bottom: 24px;
      max-height: 275px;
      -webkit-transition: -webkit-transform .3s ease-in;
      transition: -webkit-transform .3s ease-in;
      -o-transition: transform .3s ease-in;
      transition: transform .3s ease-in;
      transition: transform .3s ease-in, -webkit-transform .3s ease-in; }
  .materialPage .materialPage-item .item h5 {
    display: block;
    line-height: 1.5;
    font-size: 1.25rem;
    color: #0d213c; }

.materialPage .materialPage-item a:hover img {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1); }

.materialPage .materialPage-item a:hover h5 {
  color: #0059a5; }

.materialPage .itemBootomLine {
  position: relative;
  width: 100%;
  height: 1px;
  margin-top: 32px;
  background: #979797; }
  .materialPage .itemBootomLine:last-of-type::before {
    display: none; }
  .materialPage .itemBootomLine::before {
    content: '';
    position: absolute;
    top: -4px;
    left: 50%;
    -webkit-transform: translateX(-50%) rotate(45deg);
    -ms-transform: translateX(-50%) rotate(45deg);
    transform: translateX(-50%) rotate(45deg);
    display: block;
    width: 10px;
    height: 10px;
    border-right: 1px;
    border-bottom: 1px;
    background: #fff;
    border-color: #979797;
    border-right-style: solid;
    border-bottom-style: solid; }

@media (min-width: 1200px) {
  .materialPage .container {
    max-width: 1300px; } }

@media (max-width: 992px) {
  .materialPage .materialPage-item .item-title {
    font-size: 2rem; }
  .materialPage .materialPage-item .item h5 {
    font-size: 1.5rem; } }

.proPage .proPage-item-1 {
  margin-bottom: 50px; }
  .proPage .proPage-item-1 .typeName {
    padding-top: 25px;
    text-align: center; }
    .proPage .proPage-item-1 .typeName .text {
      font-size: 2.25rem;
      font-weight: bold;
      color: #0059a5; }

.proPage .proPage-item-2 {
  padding: 50px 0; }
  .proPage .proPage-item-2 .row {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }
  .proPage .proPage-item-2 .feature li {
    margin-bottom: 22px; }
  .proPage .proPage-item-2 .feature p {
    font-size: 1.25rem;
    margin-bottom: 18px;
    font-weight: bold;
    color: #0059a5; }
  .proPage .proPage-item-2 .feature h5 {
    position: relative;
    padding-left: 20px;
    font-size: 1.1rem;
    line-height: 1.5;
    color: #0d213c; }
    .proPage .proPage-item-2 .feature h5::after {
      content: '';
      position: absolute;
      top: 8px;
      left: 4px;
      width: 8px;
      height: 8px;
      background: #0d213c; }

.proPage-content {
  padding-top: 20px;
  background-color: #e8ecf0; }
  .proPage-content .item {
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 50px 0 30px;
    border-bottom: 1px solid #0d213c;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    .proPage-content .item .item-top {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      text-align: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-bottom: 15px; }
    .proPage-content .item .item-bottom {
      text-align: right; }
    .proPage-content .item .pro-img {
      display: inline-block; }
      .proPage-content .item .pro-img img {
        width: 100%;
        max-width: 200px; }
    .proPage-content .item .specification table {
      width: 100%;
      text-align: center;
      border: solid 1px #979797;
      margin: 0 auto; }
      .proPage-content .item .specification table td,
      .proPage-content .item .specification table th {
        text-align: center;
        padding: 2px 0;
        border-top: solid 1px #979797;
        border-right: solid 1px #979797; }
        .proPage-content .item .specification table td:first-of-type,
        .proPage-content .item .specification table th:first-of-type {
          max-width: 250px; }
        .proPage-content .item .specification table td:last-of-type,
        .proPage-content .item .specification table th:last-of-type {
          border-right: 0; }
    .proPage-content .item .specification thead tr:first-of-type {
      color: #fff;
      background: #0059a5; }
    .proPage-content .item .specification thead td {
      padding: 2px 0;
      font-size: 1rem; }
    .proPage-content .item .specification tbody tr:nth-child(odd) {
      background: #ffffff; }
    .proPage-content .item .specification tbody tr:nth-child(even) {
      background: #e8ecf0; }
    .proPage-content .item .specification tbody tr td {
      padding: 4px 0; }
    .proPage-content .item .other-img img {
      margin-bottom: 5px;
      display: block;
      width: 100%;
      max-width: 200px; }

.catalogPage .catalog-item-1 {
  padding: 50px 0; }
  .catalogPage .catalog-item-1 .item {
    margin-bottom: 15px; }
    .catalogPage .catalog-item-1 .item img {
      width: 100%;
      border: 1px solid #b7b7b7; }
      .catalogPage .catalog-item-1 .item img:hover {
        -webkit-box-shadow: 0 0 5px #b7b7b7;
        box-shadow: 0 0 5px #b7b7b7; }

.webPage {
  position: relative; }
  .webPage .pageTitle {
    padding-top: 156px;
    text-align: center; }
    .webPage .pageTitle .pageText {
      font-size: 4.3rem;
      margin-bottom: 30px;
      font-weight: bold;
      color: #00ff55; }
    .webPage .pageTitle .BreadCrumbs ul {
      display: block; }
      .webPage .pageTitle .BreadCrumbs ul li {
        display: inline-block; }
      .webPage .pageTitle .BreadCrumbs ul a {
        display: inline-block;
        position: relative;
        color: #0d213c;
        margin-right: 5px; }
        .webPage .pageTitle .BreadCrumbs ul a span,
        .webPage .pageTitle .BreadCrumbs ul a h1 {
          font-size: 1.25rem; }
    .webPage .pageTitle .pageTitleLine {
      position: relative;
      width: 100%;
      height: 1px;
      margin-top: 32px;
      background: #979797; }
      .webPage .pageTitle .pageTitleLine::before {
        content: '';
        position: absolute;
        top: -4px;
        left: 50%;
        -webkit-transform: translateX(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) rotate(45deg);
        transform: translateX(-50%) rotate(45deg);
        display: block;
        width: 10px;
        height: 10px;
        border-right: 1px;
        border-bottom: 1px;
        background: #fff;
        border-color: #979797;
        border-right-style: solid;
        border-bottom-style: solid; }

#goTop {
  opacity: 0;
  position: fixed;
  bottom: 100px;
  right: 30px;
  z-index: 99;
  width: 50px;
  height: 50px;
  border: none;
  outline: none;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
  -webkit-transition: opacity .5s;
  -o-transition: opacity .5s;
  transition: opacity .5s;
  background: rgba(13, 33, 60, 0.5);
  -webkit-box-shadow: 0 0px 12px #f2f2f2;
  box-shadow: 0 0px 12px #f2f2f2; }
  #goTop .icon {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 28px;
    height: 28px; }
  #goTop.active {
    opacity: 1; }
  #goTop:hover {
    background: #0d213c;
    -webkit-box-shadow: none;
    box-shadow: none; }

@media (max-width: 992px) {
  .webPage .pageTitle {
    padding-top: 120px; }
    .webPage .pageTitle .pageText {
      font-size: 3.2rem; }
    .webPage .pageTitle .BreadCrumbs ul a span {
      font-size: 1.2rem; }
    .webPage .pageTitle .BreadCrumbs ul a h1 {
      font-size: 1.2rem; } }