@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);
.bs-wrap {
  margin: 0 auto;
  width: 100%;
  max-width: 1200px;
  padding: 0 15px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}

@media (min-width: 992px) {
  .visible-xs {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .visible-xs {
    display: none !important;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
}

/* flex */
.column {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}

.cae {
  -webkit-box-align: end;
  align-items: flex-end;
}

.cac {
  -webkit-box-align: center;
  align-items: center;
}

.cjc {
  -webkit-box-pack: center;
  justify-content: center;
}

.row {
  display: -webkit-box;
  display: flex;
  display: -webkit-flex;
}

.rac {
  -webkit-box-align: center;
  align-items: center;
  -webkit-align-items: center;
}

.rje {
  -webkit-box-pack: end;
  justify-content: flex-end;
  -webkit-justify-content: flex-end;
}

.rjc {
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-justify-content: center;
}

.jsb {
  -webkit-box-pack: justify;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}

.jsa {
  justify-content: space-around;
  -webkit-justify-content: space-around;
}

.m0 {
  margin: 0px;
}

.m5 {
  margin: 5px;
}

.mb5 {
  margin-bottom: 5px;
}

.mb15 {
  margin-bottom: 15px;
}

* {
  box-sizing: border-box;
}

body {
  font-family: Microsoft JhengHei;
  font-size: 16px;
}

a {
  text-decoration: none;
}

ul, li {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#app {
  display: -webkit-box;
  display: flex;
  min-height: 100vh;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}

#main-content {
  -webkit-box-flex: 1;
  flex: 1 0 auto;
  min-height: 1px;
}

header#header, footer#footer {
  flex-shrink: 0;
}

.swiper-container {
  width: 100%;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
}

.banner-title1 {
  background-color: #f3f6f6;
  height: 180px;
}

.banner-title1 h1 {
  margin: 0;
}

@media (min-width: 0px) and (max-width: 767px) {
  .banner-title1 {
    height: 140px;
  }
}

.breadcrumb {
  width: 100%;
  height: 65px;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  border-bottom: 1px solid #e3e2e1;
}

.breadcrumb li span {
  margin: 5px;
}

.breadcrumb li a {
  font-size: 15px;
  color: #898989;
}

.breadcrumb li .active {
  color: #24283b;
}

.drawer-menu > li {
  padding: 0 20px;
  height: 60px;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  border-bottom: 1px solid #333f51;
}

li.lang {
  padding: 0;
  display: -webkit-box;
  display: flex;
  height: 75px;
  border-top: 1px solid #282e42;
  background: #24283b;
  position: absolute;
  bottom: 0;
  width: 100%;
}

li.lang div {
  line-height: 65px;
  height: 75px;
  -webkit-box-flex: 1;
  flex: 1;
  text-align: center;
}

li.lang div a {
  color: #fff;
}

li.lang .active {
  background-color: #282e42;
}

.drawer-hamburger {
  position: absolute;
  z-index: 111;
  top: 30px;
}

.drawer-hamburger-icon,
.drawer-hamburger-icon:after,
.drawer-hamburger-icon:before {
  width: 30px;
  border-radius: 10px;
  height: 4px;
  background-color: #aae0de;
}

.drawer--top .drawer-hamburger,
.drawer--top.drawer-open .drawer-hamburger {
  right: 10px;
  width: 43px;
}

.drawer-menu-item {
  color: #788d9a;
  font-size: 15px;
}

.drawer-brand {
  width: 100%;
  text-align: center;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 3.75rem;
  display: block;
  padding-right: .75rem;
  padding-left: .75rem;
  text-decoration: none;
  color: #4F4C49;
}

.drawer-nav {
  position: fixed;
  z-index: 2;
  top: 0;
  overflow: hidden;
  width: 20rem;
  height: 100%;
  color: #788d9a;
  background-color: #24283b;
}

.drawer--right .drawer-nav {
  z-index: 105;
  right: -20.25rem;
  -webkit-transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.drawer--right.drawer-open .drawer-hamburger {
  right: 0em;
  z-index: 1000;
}

.drawer-menu-item {
  width: 100%;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}

.drawer-menu-item p {
  margin: 0;
}

.drawer-menu-item span {
  /* IE 9 */
  -webkit-transform: scale(0.5, 0.5);
  /* Safari */
  transform: scale(0.5, 0.5);
}

.drawer-menu-item i {
  color: #00bdc5;
}

.drawer--right .drawer-hamburger, .drawer--right.drawer-open .drawer-nav, .drawer--right.drawer-open .drawer-navbar .drawer-hamburger {
  z-index: 105;
  top: 0px;
}

.drawer-menu-item:hover {
  text-decoration: none;
}

.drawer-overlay {
  position: fixed;
  z-index: 104;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
}

.select-style {
  padding: 0;
  margin: 0;
  border: 1px solid #ccc;
  width: 100%;
  border-radius: 3px;
  overflow: hidden;
  background-color: #fff;
  background: #fff url("http://www.scottgood.com/jsg/blog.nsf/images/arrowdown.gif") no-repeat 90% 50%;
}

.select-style select {
  padding: 10px 8px;
  width: 100%;
  border: none;
  box-shadow: none;
  background-color: transparent;
  background-image: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.select-style select:focus {
  outline: none;
}

.pagination {
  margin-top: 40px;
  margin-bottom: 20px;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
}

.pagination > li {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 0 5px;
  border-bottom: 0 !important;
}

.pagination > li a {
  font-size: 13px;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: #9f9f9f;
}

.pagination .active {
  position: relative;
  font-size: 13px;
  color: #3c323c;
}

.pagination .active:after {
  position: absolute;
  content: "\00a0";
  top: 32px;
  width: 20px;
  height: 2px;
  background-color: #4d4d4d;
}

@media (min-width: 0px) and (max-width: 767px) {
  .pagination {
    margin-top: 40px;
    display: -webkit-box;
    display: flex;
  }
  .pagination > li {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    margin: 0 3px;
  }
  .pagination > li a {
    font-size: 13px;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    color: #9f9f9f;
  }
}

header {
  width: 100%;
  height: 70px;
  background-color: #171b2b;
}

header .logo {
  width: 30%;
}

header .logo img {
  width: 120px;
}

header nav {
  width: 70%;
}

header .menu {
  width: 600px;
}

header .menu li {
  height: 100px;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
}

header .menu li a {
  color: #aae0de;
  padding: 0 15px;
  font-size: 17px;
}

header .lang-car ul {
  display: -webkit-box;
  display: flex;
  width: 173px;
  font-size: 14px;
  font-weight: 700;
  -webkit-box-pack: justify;
  justify-content: space-between;
}

header .lang-car ul li a {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  border-radius: 22.5px;
  width: 32px;
  height: 32px;
  border: 1px solid #aae0de;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  color: #aae0de;
}

header .lang-car ul .active a {
  color: #171b2b;
  background-color: #aae0de;
}

header .lang-car ul i {
  color: #aae0de;
}

@media (min-width: 0px) and (max-width: 767px) {
  header .lang-car ul {
    -webkit-box-pack: end;
    justify-content: flex-end;
  }
  header .lang-car ul li {
    display: none;
  }
}

footer {
  width: 100%;
  min-height: 120px;
  background-color: #171b2b;
}

footer .footer-top {
  min-height: 60px;
  border-bottom: 1px solid #24283b;
}

footer .footer-top .menu {
  width: 600px;
}

footer .footer-top .menu li a {
  color: #aae0de;
  padding-right: 30px;
}

footer .footer-top .icon a {
  margin: 0 5px;
}

footer .footer-top .icon img {
  width: 31px;
  height: 31px;
}

@media (min-width: 0px) and (max-width: 767px) {
  footer .footer-top {
    -webkit-box-pack: center;
    justify-content: center;
  }
}

footer .footer-bottom {
  min-height: 60px;
}

footer .footer-bottom p, footer .footer-bottom a {
  font-size: 14px;
  color: #aae0de;
}

@media (min-width: 0px) and (max-width: 767px) {
  footer .footer-bottom {
    padding: 15px 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    text-align: center;
  }
  footer .footer-bottom p, footer .footer-bottom a {
    line-height: 26px;
    margin: 0;
  }
}

.about-hover {
  display: none;
  opacity: 0;
  top: 70px;
  left: 0;
  z-index: 10;
  position: absolute;
  padding: 30px 0;
  width: 100%;
  min-height: 200px;
  background-color: #171b2b;
}

.about-hover h1 {
  font-size: 18px;
  color: #aae0de;
}

.about-hover .about-hover-wrap {
  flex-wrap: wrap;
  -webkit-box-align: center;
  align-items: center;
}

.about-hover .about-hover-wrap .about-item {
  width: 23%;
  margin-right: 2.6%;
}

.about-hover .about-hover-wrap .about-item:nth-child(4n) {
  margin-right: 0;
}

.about-hover .about-hover-wrap .about-item img {
  width: 100%;
}

.category-hover {
  display: none;
  opacity: 0;
  top: 70px;
  left: 0;
  z-index: 10;
  position: absolute;
  padding: 30px 0;
  width: 100%;
  min-height: 200px;
  background-color: #171b2b;
}

.category-hover h1 {
  font-size: 18px;
  color: #aae0de;
}

.category-hover .category-hover-wrap {
  -webkit-box-pack: center;
  justify-content: center;
  flex-wrap: wrap;
  -webkit-box-align: center;
  align-items: center;
}

.category-hover .category-hover-wrap .category-item {
  width: 23%;
  margin-right: 2.6%;
}

.category-hover .category-hover-wrap .category-item:nth-child(4n) {
  margin-right: 0;
}

.category-hover .category-hover-wrap .category-item img {
  width: 100%;
}

.banner-img {
  width: 100%;
  height: 700px;
}

.banner-img .banner-title {
  text-align: left;
  width: 350px;
}

.banner-img .banner-title h1 {
  color: #fff;
  font-size: 65px;
  font-family: Microsoft Yi Baiti;
}

.banner-img .banner-title p {
  color: #fff;
  font-family: Microsoft Yi Baiti;
  font-size: 32px;
}

.banner-img .icon {
  width: 100%;
  margin-top: 80px;
}

.banner-img .icon a {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
}

.banner-img .icon .icon-img {
  padding: 15px;
  padding-bottom: 0;
  width: 160px;
  height: 160px;
}

.banner-img .icon .icon-img p {
  color: #fff;
}

@media (min-width: 768px) and (max-width: 991px) {
  .banner-img {
    height: 500px;
  }
  .banner-img .icon {
    width: 100%;
    margin-top: 80px;
  }
  .banner-img .icon a {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
  }
  .banner-img .icon .icon-img {
    padding: 15px;
    padding-bottom: 0;
    width: 100px;
    height: 100px;
  }
  .banner-img .icon .icon-img p {
    color: #fff;
    font-size: 11px;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .banner-img {
    height: 377px;
  }
  .banner-img .banner-title {
    text-align: left;
    width: 100%;
  }
  .banner-img .banner-title h1 {
    color: #fff;
    font-size: 50px;
    font-family: Microsoft Yi Baiti;
  }
}

#home {
  width: 100%;
  min-height: 800px;
}

#home .home-about {
  min-height: 360px;
  background-color: #171b2b;
  padding: 0 15px;
}

#home .home-about p {
  max-width: 570px;
  color: #fff;
  line-height: 35px;
}

#home .home-about a {
  border-radius: 5px;
  width: 200px;
  height: 45px;
  margin: 20px 0;
  color: #23283d;
  background-color: #aae0de;
}

#home .home-row1 {
  width: 100%;
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-row1 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
}

#home .home-row1-left,
#home .home-row1-right {
  width: 50%;
  background-color: #809fa8;
}

@media (min-width: 768px) and (max-width: 991px) {
  #home .home-row1-left img,
  #home .home-row1-right img {
    width: 40px;
    height: 40px;
  }
  #home .home-row1-left h1,
  #home .home-row1-right h1 {
    margin: 5px;
  }
  #home .home-row1-left p,
  #home .home-row1-right p {
    margin: 10px;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-row1-left,
  #home .home-row1-right {
    width: 100%;
  }
  #home .home-row1-left img,
  #home .home-row1-right img {
    width: 40px;
    height: 40px;
  }
  #home .home-row1-left h1,
  #home .home-row1-right h1 {
    margin: 5px;
  }
  #home .home-row1-left p,
  #home .home-row1-right p {
    margin: 10px;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-row1-right {
    padding: 40px 0;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-row1-left {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
}

#home .home-row1-right h1 {
  font-size: 28px;
  color: #aae0de;
  margin-bottom: 5px;
}

#home .home-row1-right p {
  color: #efefef;
  max-width: 315px;
  text-align: center;
  line-height: 25px;
}

#home .row-info {
  position: relative;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  overflow: hidden;
  width: 50%;
  height: 360px;
}

#home .row-info img {
  max-width: 100%;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

#home .row-info .inner__block {
  position: absolute;
  z-index: 2;
  left: 10%;
  right: 10%;
  top: 10%;
  bottom: 10%;
  padding: 20px 0;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  color: #fff;
  opacity: 0.8;
}

#home .row-info .inner__block h1 {
  font-size: 42px;
}

#home .row-info .inner__block span {
  font-size: 13px;
}

#home .row-info .inner__block .line {
  width: 30px;
  height: 1px;
  background-color: #fff;
  margin: 4px;
}

@media (min-width: 768px) and (max-width: 991px) {
  #home .row-info .inner__block h1 {
    font-size: 25px;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .row-info {
    width: 100%;
  }
}

#home .home-row2 {
  width: 100%;
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-row2 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
}

#home .home-row2-left {
  width: 50%;
  background-color: red;
}

#home .home-row2-left .row-info {
  width: 100%;
}

#home .home-row2-left .row-info .inner__block {
  left: 30%;
  right: 30%;
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-row2-left {
    width: 100%;
  }
  #home .home-row2-left .row-info .inner__block {
    left: 10%;
    right: 10%;
    top: 10%;
    bottom: 10%;
  }
}

#home .home-row2-right {
  width: 50%;
}

#home .home-row2-right .row-info {
  width: 100%;
}

#home .home-row2-right .row-info .inner__block {
  top: 30%;
  bottom: 30%;
  left: 30%;
  right: 30%;
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-row2-right {
    width: 100%;
  }
  #home .home-row2-right .row-info {
    width: 100%;
  }
  #home .home-row2-right .row-info .inner__block {
    top: 10%;
    bottom: 10%;
    left: 10%;
    right: 10%;
  }
}

#home .row2-text {
  width: 100%;
  background-color: #24283b;
}

#home .row2-text h1 {
  font-size: 28px;
  color: #aae0de;
  margin-bottom: 5px;
}

#home .row2-text p {
  color: #efefef;
  max-width: 315px;
  text-align: center;
  line-height: 25px;
}

@media (min-width: 768px) and (max-width: 991px) {
  #home .row2-text img {
    width: 40px;
    height: 40px;
  }
  #home .row2-text h1 {
    margin: 5px;
  }
  #home .row2-text p {
    margin: 10px;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .row2-text img {
    width: 40px;
    height: 40px;
  }
  #home .row2-text h1 {
    margin: 5px;
  }
  #home .row2-text p {
    margin: 10px auto;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .row2-text {
    padding: 40px 0;
    text-align: center;
  }
}

#home .home-contact {
  width: 100%;
  padding-top: 100px;
  padding-bottom: 100px;
  background: url("../images/service.jpg") center center no-repeat;
}

#home .home-contact h1 {
  color: #aae0de;
  margin-bottom: 50px;
  text-align: center;
}

#home .home-contact .input-group {
  width: 100%;
}

#home .home-contact .input-group .left,
#home .home-contact .input-group .right {
  width: 50%;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}

#home .home-contact .input-group .left input,
#home .home-contact .input-group .right input {
  color: #fff;
  width: 100%;
  height: 60px;
  border: 0;
  border-bottom: 1px solid #505e75;
  background: transparent;
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-contact .input-group {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
  #home .home-contact .input-group .left,
  #home .home-contact .input-group .right {
    width: 100%;
  }
}

#home .home-contact div.submit .icon a {
  margin: 0 5px;
}

#home .home-contact div.submit .icon img {
  width: 31px;
  height: 31px;
}

#home .home-contact div.submit button {
  border-radius: 5px;
  width: 200px;
  height: 45px;
  margin: 40px 0;
  border: 0;
  color: #23283d;
  background-color: #aae0de;
}

#home .home-news {
  width: 100%;
  padding-top: 60px;
  padding-bottom: 60px;
  background-color: #24283b;
}

#home .home-news .news-title {
  width: 30%;
  color: #aae0de;
}

#home .home-news .news-title h1 {
  font-size: 45px;
}

#home .home-news ul li {
  padding: 0 20px;
  width: 50%;
  margin-top: 40px;
  border-left: 1px solid #ffffff;
}

#home .home-news ul li a {
  color: #fff;
  line-height: 36px;
}

#home .home-news ul li a p {
  margin: 0;
}

#home .home-news ul li a span {
  color: #aae0de;
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-news ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    width: 100%;
  }
  #home .home-news ul li {
    width: 100%;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  #home .home-news {
    padding: 40px 0;
  }
  #home .home-news .news-title {
    width: 100%;
    color: #aae0de;
  }
  #home .home-news .news-title h1 {
    font-size: 45px;
  }
}

#about {
  padding-top: 80px;
  width: 100%;
  min-height: 500px;
  background-color: #f3f6f6;
}

#about .row1 {
  min-height: 210px;
  border-bottom: 1px solid #e3e2e1;
  margin-bottom: 40px;
}

#about .row1 h1 {
  color: #24283b;
  font-size: 30px;
  margin: 0;
}

#about .row1 p {
  margin: 0;
  line-height: 30px;
  font-size: 15px;
  color: #727171;
}

#about .row1 .row-left {
  width: 40%;
}

#about .row1 .row-right {
  width: 60%;
  padding-bottom: 30px;
}

@media (min-width: 0px) and (max-width: 767px) {
  #about .row1 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    padding: 20px 0;
  }
  #about .row1 h1 {
    margin-bottom: 20px;
  }
  #about .row1 .row-left,
  #about .row1 .row-right {
    width: 100%;
  }
}

.link {
  width: 100%;
}

.link .row-info {
  position: relative;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  overflow: hidden;
  width: 50%;
  height: 360px;
}

.link .row-info img {
  max-width: 100%;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.link .row-info .inner__block {
  position: absolute;
  border-radius: 5px;
  border: 1px solid #f3f6f6;
  z-index: 2;
  left: 15%;
  right: 15%;
  top: 15%;
  bottom: 15%;
  padding: 20px 0;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  color: #fff;
  opacity: 0.8;
}

.link .row-info .inner__block h1 {
  font-size: 30px;
  margin: 10px;
}

.link .row-info .inner__block span {
  font-size: 13px;
}

.link .row-info .inner__block .line {
  width: 30px;
  height: 1px;
  background-color: #fff;
  margin-top: 10px;
}

@media (min-width: 768px) and (max-width: 991px) {
  .link .row-info .inner__block {
    left: 20%;
    right: 20%;
    top: 8%;
    bottom: 8%;
  }
  .link .row-info .inner__block h1 {
    font-size: 25px;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .link .row-info .inner__block {
    left: 15%;
    right: 15%;
    top: 15%;
    bottom: 15%;
  }
  .link .row-info .inner__block h1 {
    font-size: 15px;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .link .row-info {
    width: 100%;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .link {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
}

.about-banner {
  height: 505px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .about-banner {
    height: 377px;
  }
}

#news {
  background: #f3f6f6;
  min-height: 500px;
  padding-bottom: 100px;
}

.news-left {
  width: 20%;
}

.news-left h1 {
  font-size: 35px;
  margin: 0;
}

.news-left ul {
  width: 100%;
}

.news-left ul li {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  height: 60px;
  border-bottom: 1px solid #d7dada;
}

.news-left ul li a {
  color: #898989;
}

.news-left ul li a i {
  margin-right: 10px;
}

.news-right {
  width: 80%;
  padding-left: 60px;
}

.news-right ul li {
  background-color: #fff;
  margin-bottom: 40px;
}

.news-right ul li .news-info {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
}

.news-right ul li .news-info .news-title {
  padding: 0 40px;
}

.news-right ul li .news-info .news-title p {
  color: #171b2b;
  font-size: 20px;
  line-height: 30px;
}

.news-right ul li .news-info .news-title span {
  color: #aae0de;
}

.news-right ul li .news-info i {
  margin-right: 20px;
  color: #aae0de;
}

.news-right ul li .text-wrap {
  display: none;
  padding: 30px 30px;
  color: #9d9e9e;
  line-height: 30px;
}

@media (min-width: 768px) and (max-width: 991px) {
  .news-right {
    width: 100%;
    padding: 0;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .news-right {
    width: 100%;
    padding: 0;
  }
  .news-right img {
    display: none;
  }
  .news-right ul li .news-info .news-title {
    padding: 10px 15px;
  }
  .news-right ul li .news-info .news-title p {
    color: #171b2b;
    font-size: 15px;
    line-height: 30px;
  }
  .news-right ul li .news-info i {
    display: none;
  }
  .news-right ul li .text-wrap {
    display: none;
    padding: 10px 10px;
    color: #9d9e9e;
    line-height: 30px;
  }
}

.news-top {
  margin-top: 80px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .news-top {
    margin-top: 40px;
  }
}

#category {
  background: #f3f6f6;
  min-height: 500px;
  padding-bottom: 100px;
}

.category-left {
  width: 25%;
}

.category-left h1 {
  font-size: 35px;
  margin: 0;
}

.category-left ul.main-ul {
  margin-top: 40px;
  width: 100%;
}

.category-left ul.main-ul > li {
  padding: 0 15px;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  height: 60px;
  background-color: #aae0de;
  border-bottom: 1px solid #fff;
}

.category-left ul.main-ul > li a {
  width: 100%;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  justify-content: space-between;
  color: #fff;
}

.category-left ul.main-ul > li a i {
  margin-right: 10px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .category-left ul.main-ul {
    margin-top: 0;
  }
}

.category-left ul.sub-ul {
  display: none;
  width: 100%;
}

.category-left ul.sub-ul > li {
  padding: 0 15px;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  height: 60px;
  background-color: #e6e7ea;
  border-bottom: 1px solid #fff;
}

.category-left ul.sub-ul > li a {
  width: 100%;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  color: #595757;
}

.category-left ul.sub-ul > li a i {
  margin-right: 10px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .category-left {
    width: 100%;
  }
}

.category-right {
  width: 75%;
  padding-left: 2%;
}

.category-right ul.main {
  margin-top: 40px;
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
}

.category-right ul.main li {
  padding: 0 15px;
  background-color: #fff;
  position: relative;
}

.category-right ul.main li img {
  width: 100%;
}

.category-right ul.main li a {
  color: #000;
}

.category-right ul.main li a span {
  font-size: 16px;
  color: #727171;
}

.category-right ul.main li a p {
  width: 90%;
  font-size: 16px;
  line-height: 25px;
}

.category-right ul.main li i {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  position: absolute;
  right: 0;
  bottom: 0;
  width: 40px;
  height: 40px;
  background-color: #aae0de;
  color: #fff;
}

@media (min-width: 992px) {
  .category-right ul.main li {
    width: calc(95%/3);
    margin-right: 2%;
    margin-bottom: 2%;
  }
  .category-right ul.main li:nth-child(3n) {
    margin-right: 0;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .category-right ul.main li {
    width: calc(95%/2);
    margin-right: 2%;
    margin-bottom: 2%;
  }
  .category-right ul.main li:nth-child(2n) {
    margin-right: 0;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .category-right ul.main li {
    width: 100%;
    margin-bottom: 2%;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .category-right {
    width: 100%;
    padding: 0;
  }
}

.category-top {
  margin-top: 60px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .category-top {
    margin-top: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
}

#product {
  padding-bottom: 100px;
  background: #f3f6f6;
  min-height: 1200px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .product-banner h1 {
    text-align: center;
  }
}

.product-title {
  padding: 50px 0;
}

.product-title .icon a {
  margin: 0 5px;
}

.product-title .icon img {
  width: 31px;
  height: 31px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .product-title {
    padding: 0;
  }
}

.product-wrap .product-left, .product-wrap .product-right {
  width: 50%;
}

.product-wrap .small-img img {
  margin-right: 1%;
  width: 18%;
}

@media (min-width: 0px) and (max-width: 767px) {
  .product-wrap .small-img img {
    margin-right: 1%;
    width: 17%;
  }
}

.product-wrap .product-right {
  padding-left: 60px;
}

.product-wrap .product-right span {
  font-size: 16px;
  color: #727171;
}

.product-wrap .product-right h1 {
  font-size: 22px;
  margin-bottom: 40px;
}

.product-wrap .product-right p {
  font-size: 14px;
  color: #727171;
}

.product-wrap .product-right .product-button {
  margin-top: 60px;
  position: relative;
  bottom: 0;
}

.product-wrap .product-right .product-button a {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  width: 49%;
  height: 50px;
  color: #fff;
  border-radius: 5px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .product-wrap .product-right {
    padding-left: 0;
    margin-top: 40px;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .product-wrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
  .product-wrap .product-left, .product-wrap .product-right {
    width: 100%;
  }
}

.product-txt p {
  margin: 0;
  line-height: 30px;
}

div.line {
  height: 1px;
  width: 100%;
  background-color: #d7dada;
  margin: 50px 0;
}

.product-txt {
  font-size: 14px;
  color: #727171;
}

.back {
  position: absolute;
  right: 16px;
  color: #24283b;
  font-size: 25px;
}

.back i {
  margin-right: 10px;
}

#contact {
  padding: 50px 0;
  width: 100%;
  min-height: 500px;
  background-color: #f3f6f6;
}

.contact-left,
.contact-right {
  width: 48%;
  overflow: hidden;
}

.contact-left p {
  color: #727171;
  padding: 10px 0;
  font-size: 15px;
}

.contact-left a {
  color: #24283b;
  margin-left: 0px;
  font-size: 13px;
}

.contact-left .icon a {
  margin: 0;
  margin-right: 10px;
}

.contact-left .icon img {
  width: 31px;
  height: 31px;
}

@media (min-width: 0px) and (max-width: 767px) {
  .contact-left p {
    font-size: 14px;
  }
}

.contact-right h1 {
  font-size: 35px;
  font-family: Inconsolata◆;
  color: #171b2b;
}

.contact-right .input-group {
  width: 100%;
}

.contact-right .input-group .left,
.contact-right .input-group .right {
  width: 100%;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}

.contact-right .input-group .left input,
.contact-right .input-group .right input {
  font-size: 14px;
  outline: none;
  width: 100%;
  height: 60px;
  border: 0;
  border-bottom: 1px solid #e3e2e1;
  background: transparent;
}

@media (min-width: 0px) and (max-width: 767px) {
  .contact-right .input-group {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
  .contact-right .input-group .left,
  .contact-right .input-group .right {
    width: 100%;
  }
}

.contact-right div.submit button {
  border-radius: 5px;
  width: 200px;
  height: 45px;
  margin: 40px 0;
  border: 0;
  color: #23283d;
  background-color: #aae0de;
}

@media (min-width: 0px) and (max-width: 767px) {
  .contact-right div.submit {
    -webkit-box-pack: center;
    justify-content: center;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .contact-right {
    margin-top: 40px;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  .contact-wrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
  .contact-wrap .contact-left,
  .contact-wrap .contact-right {
    width: 100%;
    overflow: hidden;
  }
}

#cart {
  background-color: #f3f6f6;
  min-height: 500px;
}

#cart .input-group {
  width: 100%;
}

#cart .input-group .left,
#cart .input-group .right {
  width: 100%;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
}

#cart .input-group .left input,
#cart .input-group .right input {
  font-size: 14px;
  outline: none;
  width: 100%;
  height: 60px;
  border: 0;
  border-bottom: 1px solid #e3e2e1;
  background: transparent;
}

@media (min-width: 0px) and (max-width: 767px) {
  #cart .input-group {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
  #cart .input-group .left,
  #cart .input-group .right {
    width: 100%;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  #cart div.submit {
    -webkit-box-pack: center;
    justify-content: center;
  }
}

#cart .submit-btn {
  align-self: flex-end;
  border-radius: 5px;
  width: 50%;
  height: 45px;
  margin: 0px 0;
  border: 0;
  color: #23283d;
  background-color: #aae0de;
}

@media (min-width: 0px) and (max-width: 767px) {
  #cart .submit-btn {
    width: 100%;
  }
}

#cart .cart-p {
  margin-top: 40px;
  font-size: 14px;
  width: 50%;
  color: #898989;
  align-self: flex-end;
}

@media (min-width: 0px) and (max-width: 767px) {
  #cart .cart-p {
    width: 100%;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  #cart .category-right {
    width: 100%;
  }
}

@media (min-width: 0px) and (max-width: 767px) {
  #cart .category-right {
    width: 100%;
  }
}

.cart-container {
  margin-bottom: 102px;
}

.cart-qty button {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  outline: none;
  background: #fff;
  border: 0px;
  padding: 0;
  border-radius: 0px;
}

.cart-qty .qty-btn {
  width: 22px;
  height: 22px;
  background-color: #f3f6f6;
}

.cart-qty .qty-btn i {
  color: #9fa0a0;
}

.cart-qty .qty {
  text-align: center;
  width: 40px;
  height: 40px;
  background-color: #f3f6f6;
  border: 1px solid #9fa0a0;
}

.cart-lists {
  color: #898989;
}

.cart-lists a {
  color: #898989;
}

.cart-lists .title {
  height: 65px;
  background-color: #e9edee;
}

.cart-lists .title .col2 {
  padding-left: 180px;
}

.cart-lists .col1 {
  width: 176px;
  text-align: center;
  -webkit-box-pack: center;
  justify-content: center;
}

.cart-lists .col1 img {
  width: 100%;
  border: 1px solid #f8f8f8;
}

.cart-lists .col2 {
  -webkit-box-flex: 1;
  flex: 1;
}

.cart-lists .col3 {
  width: 20%;
  -webkit-box-pack: center;
  justify-content: center;
}

.cart-lists .col4 {
  width: 10%;
  text-align: center;
  -webkit-box-pack: center;
  justify-content: center;
}

.cart-lists .items {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
}

.cart-lists .cart-item {
  padding: 20px 0;
  border-bottom: 1px solid #dcdddd;
}

.cart-lists .cart-item .col2 {
  padding-left: 67px;
}

.cart-bottom {
  height: 138px;
  background: #f7f8f8;
  -webkit-box-align: center;
  align-items: center;
}

.cart-bottom label {
  padding-left: 64px;
  padding-right: 50px;
}

.cart-bottom input {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  outline: none;
  background: #fff;
  border: 0px;
  padding: 0;
  border-radius: 0px;
  width: 550px;
  height: 50px;
}

.cart-bottom button {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  outline: none;
  background: #fff;
  border: 0px;
  padding: 0;
  border-radius: 0px;
  background: #f15a24;
  text-align: center;
  color: #fff;
  border-radius: 2.5px;
  width: 170px;
  height: 50px;
}

.cart-bottom .s2 {
  -webkit-box-flex: 1;
  flex: 1;
}

.cart-bottom .s3 {
  padding-right: 45px;
}

.area {
  background: transparent;
  margin-top: 20px;
  border: 0;
  border-bottom: 1px solid #e3e2e1;
}

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