:root {
  --color-one: #ff7473;
  --color-two: #ffc952;
  --color-three: #47b8e0;
  --color-four: #34314c;
  --owl-nav-hover: var(--ocean-blue);
  --owl-dot-current: var(--flat-red);
}
section {
  margin: 0;
  padding: 4rem 0;
}
@media screen and (max-width: 767px) {
  section {
    padding: 2rem 0;
  }
}
section:nth-of-type(2n) {
  background-color: #f8f8f8;
}
h1,
h2,
h3 {
  font-weight: 200;
}

/*==============================*/
/*                              */
/*     Component Style Begin     */
/*                              */
.shadow-style-a {
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
}
.text-shadow-a {
  text-shadow: 0 3px 9px rgba(0, 0, 0, 0.2);
  transition: 0.2s;
}
.text-shadow-a:hover {
  text-shadow: 0 4px 18px rgba(0, 0, 0, 0.25);
}
.subnav {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.subnav .subnav-title.style-a {
  background-color: var(--color-one);
  padding: 2.0rem 0;
}
.subnav .subnav-title.style-a h2 {
  color: var(--color-two);
  margin: 0 0 1.5rem;
  text-align: center;
  font-weight: 800;
}
.subnav .subnav-title.style-a h3 {
  margin: 0;
  font-family: 'Impact';
  color: #fff;
  font-size: 1.25rem;
  text-align: center;
}
.subnav .subnav-content ul li a {
  padding: 0.5rem 1.0rem;
  font-size: 1.25rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  color: #555;
  transition: all 0.2s;
  font-weight: 200;
}
.subnav .subnav-content ul li {
  border-bottom: 1px solid #fff;
}
.subnav .subnav-content ul li:last-of-type {
  border-bottom: none;
}
.subnav .subnav-content ul li:last-of-type a {
  border-bottom: 1px solid transparent;
}
.subnav .subnav-content ul li a i {
  margin-right: 0.75rem;
  color: inherit;
}
.subnav .subnav-content ul li.active a {
  background-color: var(--color-two);
  color: #fff;
  padding-left: 2rem;
}
.subnav .subnav-content ul li a:hover {
  color: #000;
  padding-left: 2rem;
}
.subnav .subnav-content ul li.active a:hover {
  color: #fff;
}
ul.lang-select li {
  display: inline-block;
  margin-right: 0.5rem;
}
@media screen and (max-width: 767px) {
  ul.lang-select li {
    margin-right: 0.25rem;
  }
}
ul.lang-select li:last-of-type {
  margin-right: 0;
}
ul.lang-select li img {
  width: 1rem;
  margin-right: 0.25rem;
}
ul.lang-select li a {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  color: #fff;
}
@media screen and (max-width: 767px) {
  ul.lang-select li a {
    font-size: 0.9rem;
  }
}
/* learn-more style */
.learn-more.style-a {
  text-align: center;
}
.learn-more.style-a a {
  margin-top: 2rem;
  font-family: Raleway, Arial, sans-serif;
  color: rgb(255, 255, 255);
  background-color: var(--ocean-blue);
  position: relative;
  text-align: center;
  display: inline-block;
  font-weight: bold;
  font-size: 1.25em;
  border-radius: 2px;
  transition: all 0.3s ease;
  padding: 0.5rem 1rem;
  text-decoration: none;
  font-weight: 200;
}
.learn-more.style-a a i {
  margin-left: 0.5em;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  right: 0px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  transition: 0.2s;
  color: #fff;
}
.learn-more.style-a a:hover {
  padding-right: 50px;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
}
.learn-more.style-a a:hover i {
  color: rgb(255, 255, 255);
  right: 18px;
  visibility: visible;
  opacity: 1;
}

.learn-more.style-b a {
  color: #aaa;
  padding-bottom: 0.25rem;
  transition: 0.2s;
  position: relative;
  font-size: 0.9rem;
}
.learn-more.style-b a:hover {
  color: #000;
}
.learn-more.style-b a:after {
  position: absolute;
  width: 0;
  height: 1px;
  left: 0;
  bottom: 0;
  content: '';
  background-color: #aaa;
  transition: 0.4s;
}
.learn-more.style-b a:hover:after {
  width: 100%;
  background-color: #000;
}
/* section title style */
.section-title.style-a {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  align-items: flex-end;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .section-title.style-a {
    margin-bottom: 2rem;
  }
}
.section-title.style-a h2,
.section-title.style-a h3 {
  padding: 1rem 0.5rem;
  margin: 0;
  position: relative;
}
.section-title.style-a h2 {
  font-size: 3.0rem;
  padding-left: 0;
  /* color: var(--color-two); */
}
.section-title.style-a h3 {
  color: #aaa;
  font-size: 1.75rem;
  padding-right: 0;
}
.lang-en .section-title.style-a h2 {
  display: none;
}
.lang-en .section-title.style-a h3 {
  font-size: 3.0rem;
  padding-left: 0;
  text-transform: uppercase;
}
.section-title.style-a h2:after,
.section-title.style-a h3:after {
  position: absolute;
  content: '';
  height: 4px;
  width: 100%;
  left: 0;
  bottom: 0;
  background-color: var(--color-two);
}

@media screen and (max-width: 767px) {
  .section-title.style-a h2 {
    font-size: 1.5rem;
  }
  .section-title.style-a h3 {
    font-size: 1.0rem;
  }
  .section-title.style-a h2:after,
  .section-title.style-a h3:after {
    height: 2px;
  }
}

/*                              */
/*      Component Style End      */
/*                              */
/*==============================*/

/*==============================*/
/*                              */
/*     Page Home Style Begin     */
/*                              */

/* ----------- Header Style Begin ----------- */
/* nav top style */
.nav-top {
  height: 1.5rem;
  background-color: var(--color-three);
}
.nav-top .top-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
}
.nav-top .top-content .left,
.nav-top .top-content .right {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .nav-top .top-content .left,
  .nav-top .top-content .right {
    width: auto;
  }
}
.nav-top .welcome-info p {
  color: #fff;
  font-size: 0.9rem;
  line-height: 1.5rem;
}
.nav-top .top-content .right {
  text-align: right;
}
.nav-top .top-content .right ul {
  color: #fff;
}
/* nav top style end */

/* navbar setup */
.navbar-default {
  border: none;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 767px) {
  .navbar-default {
    border-bottom: 1px solid #eee;
  }
  .navbar-nav {
    margin-top: 0;
  }
}
.navbar-brand {
  padding: 0.5rem 0;
  height: auto;
}
.navbar-brand > img {
  height: 80px;
}

/* navbar item */
.navbar-nav > li > a {
  font-size: 1.25rem;
  line-height: 1rem;
  padding: 2.5rem 1.5rem;
  margin-right: 1.0rem;
}
@media screen and (max-width: 767px) {
  .navbar-nav > li > a {
    padding: 1.0rem 0;
    margin-right: 0;
    text-align: center;
    font-size: 1.0rem;
  }
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .current-menu-item > a,
.navbar-default .navbar-nav > .current-menu-item > a:focus,
.navbar-default .navbar-nav > .current-menu-item > a:hover {
  background-color: var(--color-two);
  color: #fff;
}

/* ------------ Header Style End ------------ */

/* ----------- Banner Top Style Begin ----------- */
.banner-top {
  margin-top: 7.5rem;
}
/* owl-nav */
.owl-theme .owl-nav {
  margin-top: 0;
}
.banner-top .owl-theme .owl-nav [class*=owl-] {
  padding: 1.25rem;
  border-radius: 0;
  background-color: rgba(0, 0, 0, 0.33);
  border-radius: 2px;
  margin: 0;
  position: absolute;
  opacity: 1;
  transition: all 0.2s;
}
@media screen and (max-width: 767px) {
  .banner-top .owl-theme .owl-nav [class*=owl-] {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
  }
}
.banner-top .owl-theme .owl-nav .owl-next:hover {
  padding-left: 2rem;
  padding-right: 0.5rem;
}
.banner-top .owl-theme .owl-nav .owl-prev:hover {
  padding-right: 2rem;
  padding-left: 0.5rem;
}
.banner-top .owl-theme .owl-nav [class*=owl-]:hover {
  background-color: var(--owl-nav-hover);
}
.banner-top .owl-theme .owl-nav .owl-prev {
  top: calc(50% - 31px);
  left: 2rem;
}
.banner-top .owl-theme .owl-nav .owl-next {
  top: calc(50% - 31px);
  right: 2rem;
}
.banner-top .owl-theme .owl-nav span {
  display: block;
  font-size: 1.25rem;
  color: #fff;
}

.banner-top .owl-theme .owl-dots {
  position: absolute;
  bottom: 0.5rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.banner-top .owl-theme .owl-dots .owl-dot span {
  width: 2.5rem;
  height: 2px;
  background-color: #fff;
}
.banner-top .owl-theme .owl-dots .owl-dot.active span,
.banner-top .owl-theme .owl-dots .owl-dot:hover span {
  background-color: var(--owl-dot-current);
}
@media screen and (max-width: 767px) {
  .banner-top {
    margin-top: 75px;
  }
  .banner-top .owl-theme .owl-nav .owl-next {
    right: 1rem;
  }
  .navbar-default .navbar-brand {
    position: absolute;
    left: 50%;
    padding: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .navbar-brand > img {
    height: 50px;
  }
  .navbar-toggle {
    margin-top: 0.5rem;
  }
  .navbar-default .navbar-collapse,
  .navbar-default .navbar-form {
    margin-top: 1rem;
  }
}
/* ------------ Banner Top Style End ------------ */

/* ----------- Products Center Home Style Begin ----------- */
.page-home .products-center {
  background-color: #fff;
}
.page-home .products-center .flex-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  align-items: flex-start;
}
.page-home .products-center .flex-wrapper .left {
  width: calc((100% - 2rem) / 4);
  background-color: #f6f6f6;
}
.page-home .products-center .flex-wrapper .right {
  width: calc((100% - 2rem) / 4 * 3);
}
@media screen and (max-width: 767px) {
  .page-home .products-center .flex-wrapper .left,
  .page-home .products-center .flex-wrapper .right {
    width: 100%;
  }
}
.page-home .products-center .content-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  border-bottom: 2px solid #eee;
  margin-bottom: 2rem;
}
.page-home .products-center .content-head h2 {
  color: #555;
  font-size: 1.5rem;
  margin: 0;
  padding: 1rem 0;
  position: relative;
}
.page-home .products-center .content-head h2:after {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: -2px;
  height: 4px;
  content: '';
  background-color: var(--flat-yellow);
}
.page-home .products-center .content-head a {
  font-size: 0.9rem;
  color: #aaa;
  font-weight: 200;
}

@media screen and (max-width: 767px) {
  .page-home .products-center .products {
    text-align: center;
  }
}
.page-home .products-center .products article {
  width: calc((100% - 2rem) / 3);
  padding: 2px 2px 0 2px;
  transition: all 0.2s;
  margin-bottom: 1rem;
  display: inline-block;
  margin-right: 1rem;
  float: left;
}
@media screen and (max-width: 767px) {
  .page-home .products-center .products article {
    float: none;
  }
}
.page-home .products-center .products article:nth-of-type(3n) {
  margin-right: 0;
}
@media screen and (max-width: 767px) {
  .page-home .products-center .products article {
    width: 66%;
    margin: 0 auto;
    margin-bottom: 1rem;
  }
}
@media screen and (max-width: 480px) {
  .page-home .products-center .products article {
    width: 80%;
  }
}
.page-home .products-center .products article:hover {
  background-color: var(--color-three);
}
.page-home .products-center .products article figure {
  height: 260px;
}
.page-home .products-center .products article figcaption p {
  text-align: center;
  font-size: 1.1rem;
  padding: 0.25rem 0;
  border: 1px solid #eee;
  border-top: none;
  transition: 0.2s;
}
.page-home .products-center .products article:hover figcaption p {
  color: #fff;
  transition: 0.2s;
  border-color: var(--color-three);
}
.page-home .products-center .products article:hover {
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
}

/* ------------ Products Center Home Style End ------------ */

/* ----------- News Center Style Begin ----------- */
.page-home .news-center .flex-wrapper {
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.page-home .news-center .flex-wrapper .left {
  width: calc((100% - 2rem) * 0.4);
}
.page-home .news-center .flex-wrapper .right {
  width: calc((100% - 2rem) * 0.6);
}
.page-home .news-center .flex-wrapper .right {
  padding-left: 1rem;
}
@media screen and (max-width: 767px) {
  .page-home .news-center .flex-wrapper .right,
  .page-home .news-center .flex-wrapper .left {
    width: 100%;
  }
  .page-home .news-center .flex-wrapper .right {
    padding-left: 0;
  }
}
.page-home .news-center .news-wrapper {
  padding: 1rem 1rem 1rem 2rem;
  border-left: 1px solid #ccc;
}
@media screen and (max-width: 767px) {
  .page-home .news-center .news-wrapper {
    padding: 0.5rem 0 0.5rem 1rem;
  }
}
.page-home .news-center .news-wrapper .news-item {
  margin-bottom: 2rem;
}
.page-home .news-center .news-wrapper .news-item:last-of-type {
  margin-bottom: 0;
}
.page-home .news-center .news-title {
  font-weight: 400;
  font-size: 1.4rem;
  color: #646464;
  transition: 0.2s;
  position: relative;
  display: inline-block;
  margin: 1rem 0;
}
@media screen and (max-width: 767px) {
  .page-home .news-center .news-title {
    font-size: 1.2rem;
    margin: 0.5rem 0;
  }
}
.page-home .news-center .news-title::before {
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 100%;
  background-color: #fff;
  top: 50%;
  left: -37px;
  content: '';
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  border: 1px solid #aaa;
  transition: 0.2s;
}
@media screen and (max-width: 767px) {
  .page-home .news-center .news-title::before {
    left: -21px;
  }
}
.page-home .news-center .news-title:hover {
  color: var(--color-three);
}
.page-home .news-center .news-title:hover::before {
  background-color: var(--color-three);
}
.page-home .news-center p {
  font-size: 1.0rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  white-space: nowrap;
  text-indent: 2rem;
  margin-bottom: 1rem;
  color: #555;
}
@media screen and (max-width: 767px) {
  .page-home .news-center p {
    margin-bottom: 0.5rem;
  }
}
.page-home .news-center .news-bottom {
  text-align: right;
  color: #aaa;
  font-size: 0.9rem;
}
.page-home .news-center .news-bottom * {
  font-size: inherit;
}
.page-home .news-center .news-pubdate {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.page-home .news-center .news-pubdate i {
  margin-right: 0.25rem;
}
.page-home .news-center .news-cat {
  margin-right: 1rem;
}
.page-home .news-center .news-cat strong {
  font-weight: 400;
  color: var(--ocean-blue);
  transition: 0.2s;
}
.page-home .news-center .news-cat strong:hover {
  font-weight: 600;
}
.page-home .news-center .learn-more.style-a a {
  margin-top: 4rem;
}
/* ------------ News Center Style End ------------ */

/* ----------- About Us Begin ----------- */
.page-home .about-us .flex-wrapper {
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.page-home .about-us .flex-wrapper .left {
  width: calc((100% - 2rem) * 0.6);
  padding-right: 2rem;
}
.page-home .about-us .flex-wrapper .right {
  width: calc((100% - 2rem) * 0.4);
}
@media screen and (max-width: 767px) {
  .page-home .about-us .flex-wrapper {
    margin-top: 0;
  }
  .page-home .about-us .flex-wrapper .left,
  .page-home .about-us .flex-wrapper .right {
    width: 100%;
    padding: 0 0.5rem;
  }
}
.page-home .about-us .flex-wrapper .right .dtbg {
  position: relative;
}
.page-home .about-us .flex-wrapper .right .dtbg:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #00000088;
}
.page-home .about-us .about-us-wrapper .head {
  text-align: right;
  margin-bottom: 2rem;
}
.page-home .about-us .about-us-wrapper .head h2 {
  font-size: 3rem;
  font-weight: 400;
  display: inline-block;
  color: var(--color-two);
  font-weight: 800;
}
.page-home .about-us .about-us-wrapper .head h3 {
  font-size: 1.5rem;
  margin: 0;
  padding: 0 0 1rem;
  position: relative;
}
.page-home .about-us .about-us-wrapper .head h3:after {
  position: absolute;
  content: '';
  height: 4px;
  width: 6rem;
  bottom: -0.5rem;
  right: 0;
  background-color: var(--color-three);
}
.page-home .about-us .about-us-wrapper .foot {
  margin-top: 4rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.page-home .about-us .about-us-wrapper .foot .dtbg {
  width: calc((100% - 4rem) / 2);
  height: 200px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .page-home .about-us .about-us-wrapper .foot .dtbg {
    width: calc((100% - 1rem) / 2);
  }
}
.page-home .about-us .about-us-wrapper .foot .dtbg .slogan-box {
  padding: 2rem 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #2b6dd9bb;
  color: #fff;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.page-home .about-us .about-us-wrapper .foot .dtbg:last-of-type .slogan-box {
  background-color: #ff7473bb;
}
.page-home .about-us .about-us-wrapper .foot .dtbg .slogan-box h3 {
  font-weight: 400;
}
.lang-en .page-home .about-us .about-us-wrapper .foot .dtbg .slogan-box h3 {
  font-size: 1.25rem;
}
@media screen and (max-width: 767px) {
  .page-home .about-us .about-us-wrapper .foot .dtbg .slogan-box h3 {
    font-size: 1.25rem;
  }
}
.page-home .about-us .about-us-wrapper .body p {
  text-indent: 2rem;
  line-height: 2;
  font-size: 1.0rem;
  color: #646464;
  letter-spacing: 2px;
  position: relative;
}
.lang-en .page-home .about-us .about-us-wrapper .body p {
  line-height: 2;
  letter-spacing: 1px;
  margin-bottom: 1rem;
}
.learn-more.style-b {
  text-align: right;
  bottom: 0.25rem;
  margin-left: 0;
  padding-right: 0.5rem;
}
/* ------------ About Us End ------------ */

/* ----------- Slogan Home Style Begin ----------- */
section.slogan.dtbg {
  background-size: auto;
}
.slogan .slogan-wrapper {
  text-align: center;
  color: #fff;
}
.slogan .slogan-wrapper h1 {
  margin-top: 0;
  display: inline-block;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid #fff;
  -webkit-transform: skewX(-10deg);
  transform: skewX(-10deg);
}
.lang-en .slogan .slogan-wrapper h1 {
  font-size: 2.0rem;
}
.lang-en .slogan .slogan-wrapper h2 {
  font-size: 1.75rem;
}
.slogan .slogan-wrapper h1 strong {
  font-size: 1.25em;
  margin-right: 0.5rem;
  color: var(--color-one);
}

.slogan .slogan-wrapper h2:last-of-type {
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  .slogan .slogan-wrapper h1 {
    font-size: 1.5rem;
  }
  .slogan .slogan-wrapper h2 {
    font-size: 1.25rem;
  }
}
/* ------------ Slogan Home Style End ------------ */

/* ----------- Partners Style Begin ----------- */
.partners .section-title.style-a {
  margin-bottom: 1rem;
}
.partners .slogan {
  text-align: center;
  font-size: 1.5rem;
  font-weight: 100;
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .partners .slogan {
    margin-bottom: 2rem;
  }
  section.partners {
    padding-bottom: 6rem;
  }
}
.partners-wrapper .item {
  /* height: 160px; */
  padding: 0.5rem;
}
.partners-wrapper .item > div {
  transition: 0.2s;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}
.partners-wrapper .item > div img {
  border: 1px solid #eee;
  transition: 0.2s;
}
.partners-wrapper .item > div:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  -webkit-transform: translateY(-1px);
  transform: translateY(-1px);
}

/* ------------ Partners Style End ------------ */
/*                              */
/*      Page Home Style End      */
/*                              */
/*==============================*/

/* ______________________________CONTENT-PAGE-STYLE-BEGIN______________________________ */

/* ----------- CONTENT-PAGE-GENERAL-STYLE Begin ----------- */

/* PAGINATION STYLE */
.pagi-default.pagi {
  text-align: right;
  margin: 8rem 0 4rem;
}
.pagi-default.pagi .custom-pagination span,
.pagi-default.pagi .custom-pagination a {
  margin-right: 0.5em;
}
.pagi-default.pagi span.page-num {
  margin-right: 1em;
}
.pagi-default.pagi span.current {
  padding: 0.25em 1.0em;
  border: 1px solid #e6e6e6;
  border-radius: 0;
  background-color: #555;
  color: #fff;
  font-weight: bold;
  border-color: #555;
}
.pagi-default.pagi a.page-numbers {
  padding: 0.25em 0.75em;
  text-align: center;
  border-radius: 0;
}
.pagi-default.pagi a.page-numbers:hover {
  background-color: #aaa;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .custom-pagination {
    text-align: center;
  }
  span.page-numbers {
    display: none;
  }
  span.page-numbers.current {
    display: inline;
  }
  a.page-numbers {
    display: none;
  }
  a.prev.page-numbers,
  a.next.page-numbers {
    display: inline-block;
    padding: 0.25rem 3rem !important;
    border: 1px solid #555;
  }
}

.content-page .flex-wrapper {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 2rem;
}
.main-content {
  width: 100%;
  margin-bottom: 8rem;
}
.main-content .content-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  align-items: flex-end;
  -webkit-flex-wrap: nowrapp;
  flex-wrap: nowrapp;
  border-bottom: 2px solid var(--color-three);
  margin-bottom: 2rem;
}
.main-content .content-top h2 {
  margin: 0;
  position: relative;
  font-size: 1.75rem;
  padding: 0.25rem 1.5rem;
  color: #fff;
  padding-right: 0.75rem;
}
.single-product.lang-en .main-content .content-top h2,
.taxonomy.products.lang-en .main-content .content-top h2 {
  font-size: 1.0rem;
}
.main-content .content-top h2:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: var(--color-three);
  -webkit-transform: skewX(-20deg);
  transform: skewX(-20deg);
  left: 0;
  top: 0;
  -webkit-transform-origin: 0 100%;
  transform-origin: 0 100%;
  z-index: -1;
}
.content-top ul.crumb li {
  display: inline-block;
}
.content-top ul.crumb li i {
  margin-right: 0.25rem;
}
.content-top ul.crumb li.current-page a {
  color: var(--color-three);
}
.sidebar .subnav .subnav-title {
  background-color: #555;
  padding: 1.5rem 0;
}
.sidebar .subnav,
.sidebar .side-contact {
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
  margin-bottom: 4rem;
}
.sidebar h3 {
  margin: 0;
  color: var(--color-two);
  text-align: center;
}
.sidebar h4 {
  text-transform: uppercase;
  color: #fff;
  font-size: 1.05rem;
  margin: 1rem 0 0 0;
  font-family: impact;
  text-align: center;
}
.lang-en .sidebar h3 {
  display: none;
}
.lang-en .sidebar h4 {
  margin: 0;
  color: var(--color-two);
  text-align: center;
  font-size: 1.5rem;
}
.sidebar .subnav .subnav-nav {
  border: 1px solid #eee;
  background-color: #f8f8f8;
}
.sidebar .subnav .subnav-nav li {
  border-bottom: 1px solid #eee;
  position: relative;
}
.sidebar .subnav .subnav-nav li:last-of-type {
  border-bottom: none;
}
.sidebar .subnav .subnav-nav li a {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  padding: 0.5rem 1rem;
}
.products .sidebar .subnav .subnav-nav li a {
  padding: 0.25rem 1rem;
  font-size: 0.9rem;
  line-height: 100%;
  padding-left: 1.75rem;
}
.products.taxonomy .sidebar .subnav .subnav-nav li.current-cat > a,
.news.taxonomy .sidebar .subnav .subnav-nav li.current-cat > a {
  background-color: #ffa961;
  color: #fff;
}
.products .sidebar .subnav .subnav-nav > li > a {
  font-size: 1.05rem;
  padding: 0.5rem 1rem;
  color: #000;
  font-weight: 400;
  background-color: #fff;
}
.sidebar .subnav .subnav-nav li.current-page a {
  padding-left: 2rem;
  color: #1741a2;
}
.sidebar .side-contact .side-contact-title {
  background-color: #555;
  padding: 1.0rem 0;
}
.sidebar .side-contact .side-contact-content .dtbg {
  height: 120px;
}
.sidebar .side-contact .contact-info {
  padding: 0.5rem 0;
  border: 1px solid #eee;
  border-top: none;
  background: #f8f8f8;
}
.sidebar .side-contact .contact-info li {
  font-size: 0.9rem;
  padding: 0.5rem 0.5rem;
  line-height: 1.5;
}
.sidebar .side-contact .contact-info li i {
  margin-right: 0.25rem;
}

/* SECONDARY SUBNAV STYLE */
.sidebar .subnav .subnav-nav li a ~ ul li a {
  padding-left: 2rem;
}

@media screen and (max-width: 767px) {
  .content-top ul.crumb {
    font-size: 0.8rem;
  }
  .main-content .content-top h2 {
    font-size: 1.1rem;
    padding: 0.5rem;
    padding-right: 0;
    width: 100%;
    text-align: center;
  }
  .sidebar .side-contact {
    display: none;
  }
  .main-content .content-top {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .single-product.lang-en .main-content .content-top h2,
  .content-top ul.crumb {
    width: 100%;
    margin: 0.5rem 0;
  }
}
.content-page .left {
  width: calc((100% - 2rem) * 0.2);
}
.content-page .right {
  width: calc((100% - 2rem) * 0.8);
}

/* ----------- SINGLE-POST-NAV-STYLE Begin ----------- */
.single-content-nav {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.single-content-nav .single-product-prev {
  margin-bottom: 1rem;
}
.single-content-nav .back-to {
  display: none;
}
@media screen and (max-width: 767px) {
  .single-content-nav .back-to {
    display: inline-block;
    margin: 1rem 0;
    text-align: center;
    width: 100%;
  }
  .single-content-nav .single-product-prev,
  .single-content-nav .single-product-next {
    width: 50%;
  }
  .single-content-nav .single-product-next {
    text-align: right;
  }
  .single-content-nav .single-product-prev a,
  .single-content-nav .single-product-next a {
    padding: 0.5rem;
    background-color: #555;
    color: #fff;
  }
  .single-content-nav .single-product-prev a strong,
  .single-content-nav .single-product-next a strong {
    display: none;
  }
  .single-content-nav .back-to a {
    display: inline-block;
    padding: 0.5rem 1rem;
    background-color: #f2730a;
    color: #fff;
  }
}

/* ------------ SINGLE-POST-NAV-STYLE End ------------ */

/* ------------ CONTENT-PAGE-GENERAL-STYLE End ------------ */

/* ----------- PAGE-NEWS-STYLE Begin ----------- */
.content-page.news .news-item {
  padding: 0.5rem 0;
  margin: 0.5rem 0;
  border-bottom: 1px solid #f6f6f6;
}
.content-page.news .news-item .news-title {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 0.5rem;
}
.content-page.news .news-item h4 {
  display: inline-block;
  max-width: 100%;
}
.content-page.news .news-item .news-title:hover h4 {
  color: #ffa961;
}
.content-page.news .news-item .news-bottom {
  text-align: right;
}
.content-page.news .news-item .news-bottom .news-cat {
  margin-right: 1rem;
}
.content-page.news .news-item .news-bottom .news-cat a {
  font-weight: 600;
  color: var(--color-one);
}
@media screen and (max-width: 767px) {
  .content-page.news .left {
    width: 100%;
  }
  .content-page.news .right {
    width: 100%;
  }
}
/* ------------ PAGE-NEWS-STYLE End ------------ */

/* ----------- SINGLE-NEWS-STYLE Begin ----------- */
.content-page.single-news {
  font-family: sans-serif;
}
.content-page.single-news .news-content h2 {
  text-align: center;
  margin: 2rem 0;
}
.content-page.single-news .news-content > h2:first-of-type {
  font-size: 2.5rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #eee;
}
.content-page.single-news .news-content .news-detail p {
  font-size: 1.1rem;
  line-height: 2;
  text-indent: 2rem;
  margin-bottom: 1rem;
}
.content-page.single-news .news-content .news-detail img {
  max-width: 100%;
  display: block;
  margin: 2rem 0;
  height: auto;
}
.content-page.single-news .news-content .news-pubdate {
  text-align: right;
  margin: 2rem 0 4rem;
  padding-top: 2rem;
  border-top: 1px solid #eee;
}
.content-page.single-news .news-content blockquote {
  border-left: 5px solid var(--flat-red);
}
.content-page.single-news .news-content blockquote div {
  line-height: 1.75;
  font-size: 1.1rem;
}
.content-page.single-news .news-content h4 {
  margin: 2.5rem 0 1.5rem;
  font-weight: 800;
  font-size: 1.25rem;
}
/* ------------ SINGLE-NEWS-STYLE End ------------ */

/* ----------- PAGE-PRODUCTS-STYLE Begin ----------- */
.content-page.products {
  font-family: sans-serif;
}
.content-page.products .products-wrapper {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.content-page.products .products-wrapper .product-item {
  width: calc((100% - 4rem) / 3);
  margin-bottom: 2rem;
}
.content-page.products .products-wrapper .product-item .dtbg {
  height: 280px;
  background-size: cover;
  border: 1px solid #eee;
}
.content-page.products .products-wrapper .product-item h4 {
  font-size: 1.1rem;
  line-height: 1.5;
  text-align: center;
  font-family: sans-serif;
  font-weight: 400;
  max-height: 52px;
  overflow: hidden;
}
.content-page.products .products-wrapper .product-item .dtbg:hover {
  border-color: #5474be;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 767px) {
  .content-page.products .left,
  .content-page.products .right {
    width: 100%;
  }
  .content-page.products .products-wrapper .product-item {
    width: 80%;
    margin: 0 auto 2rem;
  }
}
/* ------------ PAGE-PRODUCTS-STYLE End ------------ */

/* ----------- SINGLE-PRODUCT-STYLE Begin ----------- */
.content-page.single-product .product-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.content-page.single-product .product-info .pro-left,
.content-page.single-product .product-info .pro-right {
  width: 50%;
  margin-bottom: 2rem;
}
.content-page.single-product .product-info .pro-left {
  padding-right: 2rem;
  border-right: 1px solid #eee;
}
.content-page.single-product .product-info .pro-right {
  padding-left: 2rem;
}
.content-page.single-product .product-info .pro-left img {
  max-width: 100%;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.content-page.single-product .product-info .pro-right ul li h4 {
  color: #5474be;
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
  font-weight: 600;
}
.content-page.single-product .product-info .pro-right ul li {
  margin-bottom: 1rem;
}
.content-page.single-product .product-info .product-desc {
  width: 100%;
  margin-bottom: 2rem;
  border-top: 1px solid #eee;
}
.content-page.single-product .product-info .product-desc p {
  text-indent: 2rem;
  line-height: 2;
  font-size: 1.25rem;
}
.content-page.single-product .product-info .product-desc .product-table {
  margin-top: 2rem;
}
.content-page.single-product .product-info .product-desc .product-table img {
  max-width: 100%;
}
/* ------------ SINGLE-PRODUCT-STYLE End ------------ */

/* ----------- PAGE-CONTACT-STYLE Begin ----------- */

.contact ::-webkit-input-placeholder {
  color: #fff !important;
  opacity: 1.0; /* Firefox */
}
.contact ::placeholder {
  color: #fff !important;
  opacity: 1.0; /* Firefox */
}

.contact :-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #fff !important;
  opacity: 1.0; /* Firefox */
}

.contact ::-ms-input-placeholder {
  /* Microsoft Edge */
  color: #fff !important;
  opacity: 1.0; /* Firefox */
}

.content-page.contact .crumb-nav {
  width: 100%;
}
.content-page.contact .contact {
  margin: 2rem 0;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-bottom: 2rem;
  border-bottom: 1px solid #eee;
}
.content-page.contact .contact h2 {
  margin-top: 0;
  font-weight: 800;
  position: relative;
  display: inline-block;
  margin-bottom: 1.5rem;
  margin-right: 0.5rem;
}
.content-page.contact .contact h3 {
  display: inline-block;
  font-size: 1.25rem;
  position: relative;
  margin-top: 0;
}
.content-page.contact .contact .left,
.content-page.contact .contact .right {
  width: 50%;
}
.content-page.contact .contact .left h2,
.content-page.contact .contact .left h3 {
  color: #fff;
}

.content-page.contact .contact .left {
  background-color: #555;
  padding: 2rem 1rem;
  transition: 0.2s;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.content-page.contact .contact .left:hover {
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.33);
}
.content-page.contact .contact .right {
  padding: 2rem 1rem;
}
.content-page.contact .contact .right .contact-info ul li {
  line-height: 2;
  font-size: 1.15rem;
  margin-bottom: 0.25rem;
}
.content-page.contact .contact .right .contact-info ul li a {
  font-weight: 800;
}

.content-page.contact .contact .right .contact-info ul li i {
  color: #1741a2;
  margin-right: 0.25rem;
}
.content-page.contact .contact .right .contact-info h3 strong {
  font-weight: 800;
  color: #fff;
  padding: 0.5rem;
  background-color: var(--color-one);
  line-height: 2;
}
.content-page.contact .contact .form-control {
  border-radius: 0px !important;
  background-color: transparent;
  border: 1px solid #fff;
  color: #fff;
}
.content-page.contact .contact input[type='submit'] {
  border-radius: 0;
  background-color: var(--color-one);
  color: #fff;
  padding: 0.5rem 1.5rem;
  transition: 0.2s;
}
.content-page.contact .contact input[type='submit']:hover {
  background-color: var(--color-two);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25);
}
textarea {
  resize: none;
}
.content-page.contact #map {
  height: 450px;
  width: 100%;
  transition: 0.2s;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.content-page.contact #map:hover {
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.33);
}

.info_window {
  padding: 1rem;
}
.info-title {
  padding: 1rem;
  background-color: #555;
  color: #fff;
  font-size: 1.25rem;
}
.info-content > div {
  padding: 0.75rem 0.75rem 0 0.75rem;
  line-height: 1.5;
}
.amap-info-combo .keyword-input {
  line-height: 20px !important;
}

@media screen and (max-width: 767px) {
  .content-page.contact .contact .left,
  .content-page.contact .contact .right {
    width: 100%;
  }
}

/* ------------ PAGE-CONTACT-STYLE End ------------ */

/* ----------- PAGE-ABOUT-STYLE Begin ----------- */

.content-page .left {
  width: calc((100% - 2rem) * 0.2);
}
.content-page .right {
  width: calc((100% - 2rem) * 0.8);
}
.content-page.about .content-body .img-wrapper {
  float: right;
  margin-left: 1rem;
  text-align: center;
}

.content-page.about .content-body .img-wrapper h4 {
  width: 100%;
  font-size: 0.9rem;
  font-weight: 400;
  margin-top: 0.5rem;
}
.content-page.about .content-body .img-wrapper img {
  width: 360px;
}
.content-page.about .content-body p {
  line-height: 2;
  font-size: 1.15rem;
  text-indent: 2rem;
  margin-bottom: 2rem;
  font-family: sans-serif;
}
.content-page.about .content-body ul.features li {
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 1rem;
  line-height: 1.75;
  padding-left: 2rem;
}
.content-page.about .content-body h3,
.content-page.single-product .product-desc h3 {
  font-size: 1.25rem;
  padding: 0.25rem 1rem;
  color: #fff;
  background-color: #555;
  display: inline-block;
  margin: 1rem 0;
  -webkit-transform: skewX(-10deg);
  transform: skewX(-10deg);
  font-family: sans-serif;
}
.content-page.about .content-body h4 {
  font-family: sans-serif;
}
.content-page.about .content-body ul.cultures li {
  margin-bottom: 2rem;
}
.content-page.about .content-body ul.cultures li span {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: inline-flex;
  width: 3rem;
  height: 3rem;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  font-size: 1.25rem;
  background-color: #1741a2;
  color: #fff;
}
.content-page.about .content-body ul.cultures li span ~ p {
  display: inline;
  text-indent: 1rem;
}

.content-page.about .content-body .journey-part {
  padding: 0 0 1rem 1rem;
  border-bottom: 1px solid #eee;
}
.content-page.about .content-body .journey-part h4 {
  font-size: 1.15rem;
  margin: 1rem 0;
  font-family: sans-serif;
}
.content-page.about .content-body .journey-part ul li {
  margin-bottom: 1.5rem;
  line-height: 2;
  text-indent: 2rem;
  font-family: sans-serif;
}

@media screen and (max-width: 767px) {
  .content-page.about .left {
    width: 100%;
  }
  .content-page.about .right {
    width: 100%;
  }
  .content-page.about .content-body img {
    width: 120px;
  }
}

.content-page.about .swiper-container {
  width: 100%;
  height: 300px;
  margin-left: auto;
  margin-right: auto;
}

.content-page.about .swiper-slide {
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.content-page.about .gallery-top {
  height: 80%;
  width: 100%;
  height: 600px;
  /* padding: 4px; */
  border: 1px solid #eee;
  background-color: #f8f8f8;
  transition: 0.2s;
}
.content-page.about .gallery-top:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.content-page.about .gallery-thumbs {
  height: 20%;
  box-sizing: border-box;
  padding: 10px 0;
  height: 150px;
  /* padding: 4px; */
  background-color: #f8f8f8;
  margin-top: 32px;
  border: 1px solid #eee;
  transition: 0.2s;
}
.content-page.about .gallery-thumbs:hover {
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
}

/* 导航图样式 */
.content-page.about .gallery-thumbs .swiper-slide {
  width: 15%;
  height: 100%;
  opacity: 0.4;
  background-size: cover;
}

.content-page.about .gallery-thumbs .swiper-slide-active {
  opacity: 1;
}

.content-page.about .carousel-wrapper {
  width: 80%;
  margin: 2rem auto;
  /* border: 1px solid #000; */
}
@media screen and (max-width: 767px) {
  .content-page.about .carousel-wrapper {
    width: 100%;
  }
  .content-page.about .gallery-top {
    height: 300px;
  }
  .content-page.about .gallery-thumbs {
    height: 100px;
  }
}
/* CUSTOMIZE STYLE */
.content-page.about .swiper-button-next,
.content-page.about .swiper-button-prev {
  background-size: 50%;
  background-color: #00000088;
  border-radius: 2px;
  transition: 0.2s;
}
.content-page.about .swiper-button-next:hover,
.content-page.about .swiper-button-prev:hover {
  background-color: #000000ee;
}

.content-page.about .swiper-container .swiper-slide a {
  position: absolute;
  top: 1rem;
  right: 1rem;
  color: #fff;
  transition: 0.2s;
  padding: 0.5rem;
  background-color: #00000088;
  border-radius: 2px;
}
.content-page.about .swiper-container .swiper-slide a:hover {
  text-decoration: none;
  background-color: #000000ee;
}

/* PAGE-CERTIFICATION */
.content-page.about.certification .certification-wrapper {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.content-page.about.certification .certification-wrapper .item {
  display: inline-block;
  width: calc((100% - 4rem) / 3);
  margin-bottom: 2rem;
}
.content-page.about.certification .certification-wrapper .item img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 767px) {
  .content-page.about.certification .certification-wrapper .item {
    width: 100%;
  }
}

/* PAGE-PARTNERS-STYLE */
.content-page.about.partners .partners-wrapper {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.content-page.about.partners .partners-wrapper .item {
  display: inline-block;
  width: calc((100% - 4rem) / 3);
  margin-bottom: 2rem;
}
.content-page.about.partners .partners-wrapper .item img {
  width: 100%;
  height: auto;
}
.content-page.about.partners .partners-wrapper .item {
  border: 1px solid #eee;
}
@media screen and (max-width: 767px) {
  .content-page.about.partners .partners-wrapper .item {
    width: 100%;
  }
}
/* ------------ PAGE-ABOUT-STYLE End ------------ */

/* ______________________________CONTENT-PAGE-STYLE-END______________________________ */

/* FOOTER STYLE */
footer {
  background-color: #2b2b2b;
  padding: 4rem 0;
  padding-bottom: 0;
}
footer p.copy-right {
  text-align: center;
  padding: 0.25rem 0;
  background-color: #555;
  color: #fff;
  font-size: 0.9rem;
  margin-top: 2rem;
  border-top: 1px solid var(--color-orange);
}
footer p.copy-right a {
  color: #fff;
  font-size: 0.9rem;
}
footer .flex-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
}
footer .flex-wrapper .left {
  width: calc((100% - 2rem) * 0.6);
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
footer .flex-wrapper .right {
  width: calc((100% - 2rem) * 0.4);
}
footer .footer-nav-item h3 {
  color: #eee;
  font-size: 1.2rem;
  margin-top: 0;
  position: relative;
  margin-bottom: 0;
  padding-bottom: 1rem;
  font-weight: 800;
}
footer .footer-nav-item h3:after {
  position: absolute;
  content: '';
  height: 2px;
  width: 3rem;
  left: 0;
  bottom: 0.2rem;
  background-color: var(--color-orange);
}
footer .footer-nav-item ul li {
  line-height: 2;
}
footer .footer-nav-item ul li a {
  color: #ccc;
}
footer .footer-nav-item ul li a:hover {
  color: #555;
}
footer .flex-wrapper .right {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

footer .flex-wrapper .right > .contact-phone {
  width: calc((100% - 2rem) * 0.6);
}
footer .flex-wrapper .right > .qr-wrapper {
  width: calc((100% - 2rem) * 0.4);
  text-align: right;
}
footer .flex-wrapper .right > div img {
  width: 80%;
}
footer .flex-wrapper .right > .contact-phone {
  text-align: right;
}
footer .flex-wrapper .right > .contact-phone h4 {
  margin-top: 0;
  color: #eee;
  font-weight: 800;
}
footer .flex-wrapper .right > .contact-phone h3 {
  color: var(--color-two);
  font-size: 1.75rem;
  margin-bottom: 1.5rem;
  font-family: impact;
}
footer .flex-wrapper .right > .contact-phone ul li {
  display: inline-block;
  margin-right: 1rem;
}
footer .flex-wrapper .right > .contact-phone svg {
  color: var(--color-one);
}
footer .flex-wrapper .right > .contact-phone svg:hover {
  color: #fff;
}
footer .for-mobile {
  display: none;
}
@media screen and (max-width: 767px) {
  footer .for-mobile {
    display: block;
  }
  footer .pc-only {
    display: none;
  }
  footer .for-mobile {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    width: 100%;
    height: 80px;
    background-color: #fff;
  }
  footer .for-mobile li {
    width: calc((100% - 3px) / 4);
    height: 100%;
    background: #2b2b2b;
  }
  footer .for-mobile li a {
    width: 100%;
    height: 100%;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  footer .for-mobile li a span {
    display: inline-block;
    width: 2.5rem;
    height: 2.5rem;
    background-image: url('/img/icon/footer-nav-contact-icon.png');
    background-size: cover;
  }
  footer .for-mobile li:nth-of-type(2) a span {
    background-position: -40px 0;
  }
  footer .for-mobile li:nth-of-type(3) a span {
    background-position: -80px 0;
  }
  footer .for-mobile li:nth-of-type(4) a span {
    background-position: -120px 0;
  }
  footer .for-mobile li a p {
    width: 100%;
    text-align: center;
    color: #fff;
  }
  footer {
    padding-top: 0;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 99999;
    width: 100%;
  }
}

.animate-box {
  opacity: 0;
}
.js .animate-box {
  opacity: 0;
}

.pro-left .product-img-carousel {
  width: 100%;
  border: 1px solid #eeeeee;
  background-color: #f8f8f8;
  transition: all 0.2s;
}
.pro-left .product-img-carousel:hover {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.33);
}
.pro-left .product-img-carousel .swiper-container .swiper-wrapper .swiper-slide {
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
}
.pro-left .product-img-carousel .swiper-container .swiper-button-white {
  background-image: none;
  background-color: rgba(0, 0, 0, 0.66);
  border-radius: 2px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  transition: all 0.2s;
  opacity: 0;
}
.pro-left .product-img-carousel .swiper-container .swiper-button-white i {
  color: #ffffff;
  font-size: 1.5rem;
}
.pro-left .product-img-carousel .swiper-container:hover .swiper-button-white {
  opacity: 1;
}
.pro-left .product-img-carousel .swiper-container:hover .swiper-button-white.swiper-button-disabled {
  opacity: 0.2;
}
.pro-left .product-img-carousel .gallery-top {
  width: 100%;
  height: 320px;
}
@media screen and (max-width: 767px) {
  .pro-left .product-img-carousel .gallery-top {
    height: 200px;
  }
}
.pro-left .product-img-carousel .gallery-top .swiper-wrapper .swiper-slide {
  position: relative;
}
.pro-left .product-img-carousel .gallery-top .swiper-wrapper .swiper-slide a {
  position: absolute;
  top: 1rem;
  right: 1rem;
  color: #fff;
  transition: 0.2s;
  padding: 0.5rem;
  background-color: rgba(0, 0, 0, 0.33);
  border-radius: 2px;
}
.pro-left .product-img-carousel .gallery-top .swiper-wrapper .swiper-slide a:hover {
  background-color: rgba(0, 0, 0, 0.66);
}
.pro-left .product-img-carousel .gallery-thumbs {
  margin-top: 0;
  width: 100%;
  height: 90px;
  padding: 4px 0;
  border-top: 1px solid #eeeeee;
}
@media screen and (max-width: 767px) {
  .pro-left .product-img-carousel .gallery-thumbs {
    height: 64px;
  }
}
.pro-left .product-img-carousel .gallery-thumbs .swiper-wrapper .swiper-slide {
  opacity: 0.4;
  width: 23%;
  height: 100%;
  margin: 0 1%;
  cursor: pointer;
}
.pro-left .product-img-carousel .gallery-thumbs .swiper-wrapper .swiper-slide.swiper-slide-active {
  opacity: 1;
}