@charset "UTF-8";
.banner .banner__link, .category__list .category__link, .idx-about::after, .products__list .products__img .products__link:hover, .detail__imglist .detail__imgLink:hover, .detail__features .detail__featuresbox .detail__featuresLink:hover, .search::after, .about__wrap::after, .about__wrap .about__box .about__list .about__imglist .about__img::after, .about__wrap .about__box .about__list .about__imglist2 .about__img::after {
  background-image: url("../images/cover.png?0812");
  background-position: 0 0;
  background-repeat: repeat;
}

/*IE 滿版背景圖晃動 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  html {
    overflow: hidden;
    height: 100%;
  }
  body {
    overflow: auto;
    height: 100%;
  }
}

/*===================layout===================*/
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

body {
  font-family: "Lato", "Noto Sans TC", Arial, Verdana, Geneva, sans-serif;
  color: #0d0505;
  background-color: #ffffff;
  line-height: 26px;
  font-size: 16px;
  position: relative;
  letter-spacing: 0.02em;
  -webkit-text-size-adjust: none;
}

.body-hidden {
  height: 100vh;
  overflow: hidden;
}

a {
  color: #0d0505;
  text-decoration: none;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

a:hover {
  color: #ca0f19;
  text-decoration: none;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.img {
  background-image: url("../images/img-bg.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #f0f0f0;
  text-indent: -9999px;
}

.hide {
  display: none;
}

.clean {
  clear: both;
  line-height: 0;
  height: 0;
}

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.edit img, .edit iframe {
  max-width: 100%;
  height: auto;
}

.edit table {
  width: 100%;
  max-width: 100%;
}

.left {
  float: left;
}

.right {
  float: right;
}

.wrap-full {
  padding-bottom: 80px;
}

@media only screen and (max-width: 768px) {
  .wrap-full {
    padding-bottom: 50px;
  }
}

.wrapper {
  width: 100%;
  max-width: 1500px;
  margin: 0 auto;
}

@media only screen and (max-width: 1470px) {
  .wrapper {
    padding: 0 15px;
  }
}

.all-left {
  width: 25%;
  padding: 0 2.3%;
  position: relative;
}

@media only screen and (max-width: 1280px) {
  .all-left {
    width: 30%;
  }
}

@media only screen and (max-width: 960px) {
  .all-left {
    width: 100%;
    padding: 0 15px;
  }
}

.all-right {
  width: 75%;
  position: relative;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-line-pack: start;
      align-content: flex-start;
}

@media only screen and (max-width: 1280px) {
  .all-right {
    width: 70%;
  }
}

@media only screen and (max-width: 960px) {
  .all-right {
    width: 100%;
    padding: 0 15px;
  }
}

.all-right--page {
  padding-right: 2.3%;
}

@media only screen and (max-width: 960px) {
  .all-right--page {
    padding-right: 15px;
  }
}

.all-left__title {
  width: 100%;
  padding: 10px 5px 20px 5px;
  border-bottom: 5px solid #ca0f19;
}

.all-left__title .title-name, .all-left__title .title-name2 {
  font-weight: 700;
  text-transform: uppercase;
}

.all-left__title .title-name {
  font-size: 35px;
  font-size: 2.1875rem;
  line-height: 40px;
  line-height: 2.5rem;
}

.all-left__title .title-name2 {
  font-size: 25px;
  font-size: 1.5625rem;
  line-height: 25px;
  line-height: 1.5625rem;
}

@media only screen and (max-width: 960px) {
  .all-left__title {
    padding: 15px 10px 8px 10px;
  }
  .all-left__title .title-name {
    font-size: 25px;
    font-size: 1.5625rem;
    line-height: 35px;
    line-height: 2.1875rem;
  }
}

.all-right__title {
  width: 100%;
  padding: 5px 0 40px 0;
}

.all-right__title i, .all-right__title .title-name {
  display: inline-block;
  vertical-align: middle;
}

.all-right__title i {
  font-size: 40px;
  color: #ca0f19;
}

.all-right__title .title-name {
  padding-left: 5px;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 35px;
  font-size: 2.1875rem;
  line-height: 40px;
  line-height: 2.5rem;
}

@media only screen and (max-width: 768px) {
  .all-right__title {
    padding-bottom: 20px;
  }
  .all-right__title .title-name {
    font-size: 25px;
    font-size: 1.5625rem;
    line-height: 30px;
    line-height: 1.875rem;
  }
}

/*color*/
.red {
  color: #ca0f19;
}

/*banner arrow dots*/
.prev, .next {
  width: 40px;
  height: 40px;
  cursor: pointer;
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.prev span, .next span {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
}

.prev span::before, .prev span::after, .next span::before, .next span::after {
  content: '';
  position: absolute;
}

.prev span::before, .next span::before {
  width: 22px;
  height: 22px;
  border-style: solid;
  border-width: 0 4px 4px 0;
  border-color: #ca0f19;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
  top: 8px;
  left: 5px;
}

.prev span::after, .next span::after {
  width: 20px;
  height: 1px;
  margin: auto;
  background-color: #ffffff;
  top: 0;
  bottom: 0;
}

.prev {
  left: 20px;
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}

.prev:hover {
  left: 10px;
}

.next {
  right: 20px;
}

.next:hover {
  right: 10px;
}

.dots {
  width: 100%;
  text-align: center;
}

.dots li {
  display: inline-block;
  margin: 0 3px;
}

.dots li span {
  width: 17px;
  height: 4px;
  background-color: #ffffff;
  display: block;
  cursor: pointer;
}

.dots .slick-active span {
  background-color: #ca0f19;
}

@media only screen and (max-width: 600px) {
  .prev, .next {
    width: 30px;
    height: 30px;
  }
  .prev span::before, .next span::before {
    width: 16px;
    height: 16px;
    top: 6px;
    left: 5px;
  }
}

@media only screen and (max-width: 480px) {
  .prev {
    left: 10px;
  }
  .next {
    right: 10px;
  }
}

/*=============header===============*/
.header .header__wrap {
  padding: 25px 0 30px 0;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-line-pack: center;
      align-content: center;
  position: relative;
}

.header .header__wrap .logo {
  width: 125px;
}

.header .header__wrap .logo a {
  width: 100%;
  display: block;
}

.header .header__wrap .logo a img {
  width: 100%;
  display: block;
}

.header .header__wrap .header__info {
  position: absolute;
  left: 10px;
}

.header .header__wrap .header__info li {
  display: inline-block;
  margin-right: 30px;
}

.header .header__wrap .header__info li a {
  display: block;
}

.header .header__wrap .header__info li a i {
  display: inline-block;
  color: #6c6c6c;
}

.header .header__wrap .header__info li a .icon-volume-control-phone {
  font-size: 20px;
  -webkit-transform: rotate(-30deg);
      -ms-transform: rotate(-30deg);
          transform: rotate(-30deg);
}

.header .header__wrap .header__info li a .icon-envelope {
  font-size: 18px;
}

.header .header__wrap .header__info li a span {
  padding-left: 3px;
  font-weight: 700;
}

.header .header__wrap .header__info li a:hover i {
  color: #ca0f19;
}

.header .header__wrap .header__info li:last-child {
  margin-right: 0;
}

.header .header__wrap .header__link {
  position: absolute;
  right: 10px;
}

.header .header__wrap .header__link li {
  margin: 0 10px;
  display: inline-block;
  vertical-align: middle;
}

.header .header__wrap .header__link li a {
  color: #6c6c6c;
  font-size: 16px;
  font-size: 1rem;
  line-height: 25px;
  line-height: 1.5625rem;
}

.header .header__wrap .header__link li a i {
  display: block;
  color: #6c6c6c;
  font-size: 23px;
}

.header .header__wrap .header__link li a span {
  font-weight: 700;
  font-family: "Montserrat", "Noto Sans TC", Arial, Verdana, Geneva, sans-serif;
}

.header .header__wrap .header__link li a:hover {
  color: #ca0f19;
}

.header .header__wrap .header__link li a:hover i {
  color: #ca0f19;
}

.header .header__wrap .header__link li .header__active {
  color: #ca0f19;
}

.header .header__wrap .header__link .header__hamburger {
  display: none;
}

.header .header__wrap .header__link .header__hamburger a .icon-menu {
  font-size: 32px;
  color: #0d0505;
}

@media only screen and (max-width: 1180px) {
  .header .header__wrap .header__info li {
    display: block;
  }
}

@media only screen and (max-width: 800px) {
  .header .header__wrap {
    padding: 10px 0;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .header .header__wrap .logo {
    width: 90px;
    padding-left: 20px;
  }
  .header .header__wrap .header__info {
    display: none;
  }
  .header .header__wrap .header__link .header__hamburger {
    display: inline-block;
    -webkit-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
    transition: all .5s ease-out;
  }
  .header .header__wrap .header__link .header__hamburger--on {
    position: fixed;
    z-index: 101;
    right: 10px;
    top: 17px;
  }
  .header .header__wrap .header__link .header__hamburger--on i::before {
    content: '\ea0f';
  }
}

@media only screen and (max-width: 480px) {
  .header .header__wrap .logo {
    width: 75px;
  }
  .header .header__wrap .header__link li {
    margin: 0 7px;
  }
  .header .header__wrap .header__link .header__hamburger--on {
    top: 12px;
  }
}

.header__nav {
  width: 100%;
  border-top: 1px solid #dcdddd;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-line-pack: start;
      align-content: flex-start;
  background-color: #ffffff;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
  position: relative;
  z-index: 98;
}

@media only screen and (max-width: 800px) {
  .header__nav {
    height: 100vh;
    overflow-y: auto;
    padding: 65px 15px 0 15px;
    position: fixed;
    top: 0;
    left: 100%;
    z-index: 100;
  }
}

@media only screen and (max-width: 480px) {
  .header__nav {
    padding-top: 55px;
  }
}

.header__nav--on {
  left: 0;
}

.header__navlist {
  width: 20%;
  max-width: 220px;
  position: relative;
}

.header__navlist .header__navBtn {
  width: 40px;
  height: 40px;
  display: none;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #6c6c6c;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 3;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.header__navlist .header__navBtn i {
  display: inline-block;
  color: #ffffff;
  font-size: 20px;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.header__navlist .header__navBtn--on {
  background-color: #ca0f19;
}

.header__navlist .header__navBtn--on i {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}

@media only screen and (max-width: 800px) {
  .header__navlist {
    width: 100%;
    max-width: 100%;
    border-style: solid;
    border-color: #ccc;
    border-width: 0 0 1px 0;
  }
  .header__navlist .header__navBtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .header__navlist:first-child {
    border-width: 1px 0;
  }
}

.header__navTitle {
  width: 100%;
  padding: 15px 5px;
  display: block;
  text-align: center;
  font-family: "Montserrat", "Noto Sans TC", Arial, Verdana, Geneva, sans-serif;
  text-transform: uppercase;
  position: relative;
}

.header__navTitle::before {
  content: '';
  width: 0;
  height: 5px;
  margin: auto;
  background-color: #ca0f19;
  position: absolute;
  top: -5px;
  left: 0;
  right: 0;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.header__navTitle:hover, .header__navTitle.header__navTitle--on {
  color: #ca0f19;
}

.header__navTitle:hover::before, .header__navTitle.header__navTitle--on::before {
  width: 100%;
}

@media only screen and (max-width: 800px) {
  .header__navTitle {
    padding: 7px 10px;
    text-align: left;
    position: relative;
    z-index: 2;
  }
  .header__navTitle::before {
    height: 2px;
    top: auto;
    bottom: -1px;
  }
}

.header__navBox {
  width: 130%;
  padding: 15px 10px;
  background-color: #ca0f19;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: 0;
  -webkit-transform: translateY(30px);
      -ms-transform: translateY(30px);
          transform: translateY(30px);
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.header__navBox li {
  display: block;
  border-bottom: 1px solid #f36c73;
}

.header__navBox li a {
  width: 100%;
  padding: 5px;
  color: #ffffff;
  font-weight: 700;
  display: block;
}

.header__navBox li a:hover {
  background-color: #ffffff;
  color: #ca0f19;
}

.header__navBox li:last-child {
  border-bottom: none;
}

@media only screen and (max-width: 800px) {
  .header__navBox {
    width: 100%;
    display: none;
    position: relative;
  }
}

.header__navBox--on {
  display: block;
  visibility: visible;
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

/*banner*/
.banner-box {
  position: relative;
  background-color: #0d0505;
}

.banner-box .dots {
  text-align: center;
  position: absolute;
  left: 0;
  bottom: 6%;
  z-index: 5;
}

.banner-box .banner__prev, .banner-box .banner__next {
  z-index: 5;
}

.banner {
  position: relative;
}

.banner .banner__img {
  width: 100%;
  height: auto;
}

.banner .banner__img img {
  width: 100%;
  height: auto;
  display: block;
}

.banner .banner__link {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
}

.banner .banner__text {
  width: 100%;
  height: 100%;
  max-width: 56.25%;
  margin: auto;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-line-pack: center;
      align-content: center;
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 4;
}

.banner .banner__text h3, .banner .banner__text h4 {
  color: #ffffff;
}

.banner .banner__text h3, .banner .banner__text h4 {
  text-align: center;
  font-family: "Montserrat", "Noto Sans TC", Arial, Verdana, Geneva, sans-serif;
  font-weight: 700;
  text-transform: uppercase;
}

.banner .banner__text h3 {
  width: 100%;
  font-size: 4.5vw;
  line-height: 5.7vw;
  margin-bottom: 3%;
}

.banner .banner__text h4 {
  width: 100%;
  font-size: 1.5vw;
  line-height: 2.2vw;
  margin-bottom: 5%;
}

@media only screen and (max-width: 600px) {
  .banner .banner__text {
    max-width: calc(100% - 120px);
    padding-top: 10%;
    -ms-flex-line-pack: start;
        align-content: flex-start;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .banner .banner__text h3, .banner .banner__text h4 {
    text-align: left;
  }
  .banner .banner__text h3 {
    font-size: 35px;
    font-size: 2.1875rem;
    line-height: 40px;
    line-height: 2.5rem;
  }
  .banner .banner__text h4 {
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 25px;
    line-height: 1.5625rem;
  }
  .banner .banner__text .btn {
    display: none;
  }
}

@media only screen and (max-width: 480px) {
  .banner .banner__text h3 {
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 25px;
    line-height: 1.5625rem;
  }
  .banner .banner__text h4 {
    font-size: 14px;
    font-size: 0.875rem;
    line-height: 20px;
    line-height: 1.25rem;
    font-weight: 400;
  }
}

/*category*/
.idx-category {
  padding: 120px 0 80px 0;
}

@media only screen and (max-width: 960px) {
  .idx-category {
    padding: 30px 0 50px 0;
  }
}

.idx-category__left, .idx-category__right {
  padding-bottom: 40px;
}

@media only screen and (max-width: 1280px) {
  .idx-category__left, .idx-category__right {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}

@media only screen and (max-width: 960px) {
  .idx-category__left, .idx-category__right {
    padding-top: 0;
    padding-bottom: 0;
  }
}

.idx-category__text {
  padding: 35px 0;
}

@media only screen and (max-width: 960px) {
  .idx-category__text {
    padding: 15px 10px 45px 10px;
  }
}

.idx-category__btn {
  position: absolute;
  right: -9%;
  bottom: 135px;
  z-index: 3;
}

@media only screen and (max-width: 1280px) {
  .idx-category__btn {
    position: relative;
    bottom: 0;
    right: -5%;
  }
}

@media only screen and (max-width: 960px) {
  .idx-category__btn {
    position: absolute;
    bottom: -30px;
    right: 3%;
  }
}

@media only screen and (max-width: 480px) {
  .idx-category__btn {
    right: auto;
    left: -5px;
  }
}

.idx-category__right {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-line-pack: start;
      align-content: flex-start;
}

.category__list {
  width: 33.33333%;
  position: relative;
}

.category__list .category__link, .category__list .category__title {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.category__list .category__link {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 2;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.category__list .category__link span {
  opacity: 0;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.category__list .category__link:hover {
  background-color: rgba(202, 15, 25, 0.5);
}

.category__list .category__link:hover span {
  opacity: 1;
}

.category__list .category__img {
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  background-color: #f0f0f0;
  position: relative;
}

.category__list .category__img img {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

.category__list .category__title {
  padding: 7%;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  pointer-events: none;
  z-index: 3;
}

.category__list .category__title span {
  display: block;
  font-family: "Montserrat", "Noto Sans TC", Arial, Verdana, Geneva, sans-serif;
  font-weight: 700;
  color: #ffffff;
  font-size: 30px;
  font-size: 1.875rem;
  line-height: 40px;
  line-height: 2.5rem;
}

@media only screen and (max-width: 1080px) {
  .category__list {
    width: 50%;
  }
  .category__list .category__title span {
    font-size: 23px;
    font-size: 1.4375rem;
    line-height: 30px;
    line-height: 1.875rem;
  }
}

@media only screen and (max-width: 960px) {
  .category__list {
    width: 33.33333%;
  }
}

@media only screen and (max-width: 768px) {
  .category__list {
    width: 50%;
  }
}

@media only screen and (max-width: 480px) {
  .category__list {
    width: 100%;
  }
}

/*index about*/
.idx-about {
  background-image: url("../images/idx-aboutBG.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  position: relative;
}

.idx-about::after {
  content: '';
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

@media only screen and (max-width: 960px) {
  .idx-about {
    padding-bottom: 50px;
  }
}

.idx-about__right {
  padding-top: 80px;
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
  z-index: 3;
}

.idx-about__right .all-left__title .title-name {
  color: #ffffff;
}

.idx-about__right .idx-about__info {
  padding: 35px 0;
  color: #ffffff;
}

.idx-about__right .idx-about__btn {
  position: absolute;
  bottom: 70px;
  right: 11%;
  z-index: 6;
}

@media only screen and (max-width: 960px) {
  .idx-about__right {
    padding-top: 30px;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .idx-about__right .idx-about__btn {
    right: 15px;
    bottom: -40px;
  }
}

.idx-about__left {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
  z-index: 2;
}

@media only screen and (max-width: 960px) {
  .idx-about__left {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}

.idx-about__list {
  width: 50%;
}

.idx-about__list .idx-about__img {
  width: 50%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #ffffff;
}

.idx-about__list .idx-about__img i {
  font-size: 85px;
  display: inline-block;
}

.idx-about__list .idx-about__text {
  width: 50%;
  padding: 0 5%;
  background-color: rgba(0, 0, 0, 0.5);
}

.idx-about__list .idx-about__text .idx-about__title {
  margin-bottom: 15px;
  color: #ffffff;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 30px;
  font-size: 1.875rem;
  line-height: 40px;
  line-height: 2.5rem;
}

.idx-about__list .idx-about__text .idx-about__word {
  color: #ffffff;
}

.idx-about__list:nth-child(1) .idx-about__img, .idx-about__list:nth-child(1) .idx-about__text, .idx-about__list:nth-child(2) .idx-about__img, .idx-about__list:nth-child(2) .idx-about__text {
  padding-top: 150px;
  padding-bottom: 50px;
}

.idx-about__list:nth-child(3) .idx-about__img, .idx-about__list:nth-child(3) .idx-about__text, .idx-about__list:nth-child(4) .idx-about__img, .idx-about__list:nth-child(4) .idx-about__text {
  padding-bottom: 150px;
}

@media only screen and (max-width: 1280px) {
  .idx-about__list {
    width: 100%;
  }
  .idx-about__list .idx-about__img {
    width: 30%;
  }
  .idx-about__list .idx-about__text {
    width: 70%;
  }
  .idx-about__list:nth-child(1) .idx-about__img, .idx-about__list:nth-child(1) .idx-about__text {
    padding-top: 80px;
  }
  .idx-about__list:nth-child(2) .idx-about__img, .idx-about__list:nth-child(2) .idx-about__text {
    padding-top: 0;
  }
  .idx-about__list:nth-child(3) .idx-about__img, .idx-about__list:nth-child(3) .idx-about__text {
    padding-bottom: 50px;
  }
  .idx-about__list:nth-child(4) .idx-about__img, .idx-about__list:nth-child(4) .idx-about__text {
    padding-bottom: 80px;
  }
}

@media only screen and (max-width: 960px) {
  .idx-about__list .idx-about__img {
    width: 150px;
  }
  .idx-about__list .idx-about__img i {
    font-size: 70px;
  }
  .idx-about__list .idx-about__text {
    width: calc(100% - 150px);
    padding: 0 20px;
    background-color: rgba(0, 0, 0, 0);
  }
  .idx-about__list .idx-about__text .idx-about__title {
    font-size: 25px;
    font-size: 1.5625rem;
    line-height: 35px;
    line-height: 2.1875rem;
  }
  .idx-about__list:nth-child(even) {
    background-color: rgba(0, 0, 0, 0.7);
  }
  .idx-about__list:nth-child(1) .idx-about__img, .idx-about__list:nth-child(1) .idx-about__text {
    padding-top: 50px;
    padding-bottom: 30px;
  }
  .idx-about__list:nth-child(2) .idx-about__img, .idx-about__list:nth-child(2) .idx-about__text {
    padding-top: 20px;
    padding-bottom: 30px;
  }
  .idx-about__list:nth-child(3) .idx-about__img, .idx-about__list:nth-child(3) .idx-about__text {
    padding-top: 20px;
    padding-bottom: 30px;
  }
  .idx-about__list:nth-child(4) .idx-about__img, .idx-about__list:nth-child(4) .idx-about__text {
    padding-top: 20px;
    padding-bottom: 30px;
  }
}

@media only screen and (max-width: 480px) {
  .idx-about__list .idx-about__img {
    width: 80px;
  }
  .idx-about__list .idx-about__img i {
    font-size: 40px;
  }
  .idx-about__list .idx-about__text {
    width: calc(100% - 80px);
  }
}

/*footer*/
.footer {
  margin-top: 5px;
  border-top: 2px solid #ca0f19;
}

.footer-box {
  padding: 50px 0 30px 0;
  background-color: #f5f5f5;
}

.footer-box .footer__logo {
  width: 125px;
  margin: 0 auto 40px auto;
}

.footer-box .footer__logo a {
  width: 100%;
  display: block;
}

.footer-box .footer__logo a img {
  width: 100%;
  display: block;
}

.footer-box .footer__nav {
  text-align: center;
}

.footer-box .footer__nav li {
  display: inline-block;
}

.footer-box .footer__nav li a {
  padding: 0 30px 10px 30px;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.82813rem;
  display: block;
  text-transform: uppercase;
}

@media only screen and (max-width: 960px) {
  .footer-box {
    padding: 20px 0;
  }
  .footer-box .footer__logo {
    width: 60px;
    margin-bottom: 10px;
  }
  .footer-box .footer__nav li a {
    padding: 0px 10px;
    font-size: 14px;
    font-size: 0.875rem;
    line-height: 1.42188rem;
  }
}

.footer__info {
  padding: 40px 0;
}

.footer__info .footer__infoList {
  width: 25%;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-line-pack: start;
      align-content: flex-start;
}

.footer__info .footer__infoList .footer__infoImg {
  width: 64px;
  height: 64px;
  border-radius: 64px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #ededed;
}

.footer__info .footer__infoList .footer__infoImg i {
  color: #0d0505;
  display: inline-block;
}

.footer__info .footer__infoList .footer__infoImg .icon-volume-control-phone {
  font-size: 26px;
  -webkit-transform: rotate(-30deg);
      -ms-transform: rotate(-30deg);
          transform: rotate(-30deg);
}

.footer__info .footer__infoList .footer__infoImg .icon-fax {
  font-size: 21px;
}

.footer__info .footer__infoList .footer__infoImg .icon-location {
  font-size: 23px;
}

.footer__info .footer__infoList .footer__infoImg .icon-envelope {
  font-size: 16px;
}

.footer__info .footer__infoList .footer__infoText {
  width: calc(100% - 64px);
  padding: 5px 15px 0 15px;
}

.footer__info .footer__infoList .footer__infoText .footer__infoTitle {
  margin-bottom: 5px;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.82813rem;
}

.footer__info .footer__infoList .footer__infoText .footer__infoWord {
  display: block;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 23px;
  line-height: 1.4375rem;
  color: #6c6c6c;
  word-break: break-word;
}

@media only screen and (max-width: 1080px) {
  .footer__info {
    padding: 20px 0 5px 0;
  }
  .footer__info .footer__infoList {
    width: 50%;
    margin-bottom: 15px;
  }
}

@media only screen and (max-width: 960px) {
  .footer__info .footer__infoList .footer__infoImg {
    width: 50px;
    height: 50px;
  }
  .footer__info .footer__infoList .footer__infoText {
    width: calc(100% - 50px);
    padding: 0px 10px 0 15px;
  }
  .footer__info .footer__infoList .footer__infoText .footer__infoTitle {
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.625rem;
    margin-bottom: 0;
  }
}

@media only screen and (max-width: 480px) {
  .footer__info .footer__infoList {
    width: 100%;
  }
}

.copyright {
  padding: 10px 15px;
  background-color: #1d1919;
  text-align: center;
}

.copyright span {
  display: inline-block;
  vertical-align: middle;
  color: #ffffff;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 28px;
  line-height: 1.75rem;
}

.copyright .copyright__ework {
  padding: 0 0 0 15px;
  color: #717171;
}

.copyright .copyright__ework a {
  color: #717171;
}

/*breadcrumb*/
.breadcrumb {
  margin-bottom: 80px;
  padding: 5px 15px 10px 15px;
  background-color: #eaeaea;
}

.breadcrumb .breadcrumb__list {
  display: inline-block;
  vertical-align: middle;
}

.breadcrumb .breadcrumb__list span, .breadcrumb .breadcrumb__list i {
  display: inline-block;
  vertical-align: middle;
}

.breadcrumb .breadcrumb__list span {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 1.42188rem;
  color: #9a9a9a;
}

.breadcrumb .breadcrumb__list i {
  color: #676767;
  font-size: 18px;
}

.breadcrumb .breadcrumb__list--current span {
  color: #ca0f19;
}

.breadcrumb .breadcrumb__list:hover span {
  color: #ca0f19;
  text-decoration: underline;
}

.breadcrumb .breadcrumb__list:hover i {
  color: #676767;
}

@media only screen and (max-width: 960px) {
  .breadcrumb {
    margin-bottom: 20px;
  }
}

/*=============Category===============*/
.category-menu {
  padding: 10px 0 30px 0;
}

.category-menu__switch {
  width: 100%;
  border-radius: 8px;
  line-height: 40px;
  background-color: #ca0f19;
  color: #ffffff;
  cursor: pointer;
  text-align: center;
  display: none;
}

.category-menu__switch i, .category-menu__switch span {
  display: inline-block;
  vertical-align: middle;
}

.category-menu__switch i {
  font-size: 18px;
}

.category-menu__switch span {
  padding-left: 5px;
}

@media only screen and (max-width: 960px) {
  .category-menu__switch {
    display: block;
  }
}

.category-menu__switch--on i::before {
  content: '\ea0f';
}

.category-menu__box {
  padding-top: 15px;
}

.category-menu__box .ctegory-menu__list {
  position: relative;
}

.category-menu__box .ctegory-menu__list .category-menu__title {
  width: 100%;
  padding: 8px 10px;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.82813rem;
  font-weight: 700;
  display: block;
  border-style: solid;
  border-color: #ffe2e4;
  border-width: 0 0 1px 1px;
}

.category-menu__box .ctegory-menu__list .category-menu__btn {
  width: 36px;
  height: 46px;
  border-style: solid;
  border-color: #ffe2e4;
  border-width: 0 1px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.category-menu__box .ctegory-menu__list .category-menu__btn i {
  color: #ca0f19;
  font-size: 24px;
  display: inline-block;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.category-menu__box .ctegory-menu__list .category-menu__btn:hover {
  background-color: #d83342;
  border-color: #d83342;
}

.category-menu__box .ctegory-menu__list .category-menu__btn:hover i {
  color: #ffffff;
}

.category-menu__box .ctegory-menu__list .category-menu__btn--on {
  background-color: #d83342;
  border-color: #d83342;
}

.category-menu__box .ctegory-menu__list .category-menu__btn--on i {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
  color: #ffffff;
}

.category-menu__box .ctegory-menu__list .category-menu__layer {
  padding: 5px 0;
  background-color: #d83342;
  display: none;
}

.category-menu__box .ctegory-menu__list .category-menu__layer .category-manu__link {
  padding: 5px 10px;
  font-weight: 700;
  display: block;
  color: #ffffff;
}

.category-menu__box .ctegory-menu__list .category-menu__layer .category-manu__link:hover {
  color: #ca0f19;
  background-color: #ffffff;
}

.category-menu__box .ctegory-menu__list:first-child .category-menu__title {
  border-width: 1px 0 1px 1px;
}

.category-menu__box .ctegory-menu__list:first-child .category-menu__btn {
  top: 1px;
  border-width: 0 1px 0 1px;
}

@media only screen and (max-width: 960px) {
  .category-menu__box {
    display: none;
  }
}

/*=============products===============*/
.pro-banner {
  width: 100%;
  margin-bottom: 40px;
  position: relative;
}

.pro-banner .pro-banner__prev, .pro-banner .pro-banner__next {
  position: absolute;
  z-index: 2;
}

@media only screen and (max-width: 960px) {
  .pro-banner {
    margin-bottom: 30px;
  }
}

.pro-banner__list {
  width: 100%;
}

.pro-banner__list .pro-banner__img {
  width: 100%;
  position: relative;
}

.pro-banner__list .pro-banner__img img {
  width: 100%;
  display: block;
}

.products {
  width: 100%;
  padding-top: 30px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.products__list {
  width: calc(33.3333% - 20px);
  margin: 0 30px 50px 0;
}

.products__list .products__img {
  width: 100%;
  position: relative;
  border: 1px solid #c2c2c2;
}

.products__list .products__img .products__link {
  width: 100%;
  height: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.products__list .products__img .products__link span {
  opacity: 0;
}

.products__list .products__img .products__link:hover {
  background-color: rgba(202, 15, 25, 0.5);
}

.products__list .products__img .products__link:hover span {
  opacity: 1;
}

.products__list .products__img .products__imgbox {
  width: 100%;
  height: 0;
  background-color: #f0f0f0;
  padding: 0 0 100% 0;
  position: relative;
}

.products__list .products__img .products__imgbox img {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

.products__list .products__title {
  width: 100%;
  display: block;
  padding: 20px 10px;
  text-align: center;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.82813rem;
  font-weight: 700;
}

.products__list:nth-child(3n) {
  margin-right: 0;
}

@media only screen and (max-width: 1080px) {
  .products__list {
    width: calc(50% - 10px);
    margin: 0 15px 20px 0;
  }
  .products__list:nth-child(3n) {
    margin-right: 15px;
  }
  .products__list:nth-child(2n) {
    margin-right: 0;
  }
}

@media only screen and (max-width: 960px) {
  .products__list {
    width: calc(33.3333% - 14px);
    margin-right: 21px;
  }
  .products__list:nth-child(3n) {
    margin-right: 0;
  }
  .products__list:nth-child(2n) {
    margin-right: 21px;
  }
}

@media only screen and (max-width: 768px) {
  .products__list {
    width: calc(50% - 10px);
    margin: 0 15px 10px 0;
  }
  .products__list:nth-child(3n) {
    margin-right: 15px;
  }
  .products__list:nth-child(2n) {
    margin-right: 0;
  }
}

@media only screen and (max-width: 480px) {
  .products__list {
    width: 100%;
    margin-bottom: 0;
  }
  .products__list:nth-child(3n) {
    margin-right: 0;
  }
}

.products-unit {
  width: 100%;
  margin-bottom: 10px;
}

.products-unit .products-unit__list {
  width: 120px;
  margin-right: 5px;
  padding: 10px 5px;
  border-radius: 5px;
  text-align: center;
  display: inline-block;
  color: #ffffff;
  background-color: #6c6c6c;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.products-unit .products-unit__list:hover {
  background-color: #ca0f19;
}

.products-unit .products-unit__list--current {
  background-color: #ca0f19;
}

/*=============products detail===============*/
.detail {
  position: relative;
}

.detail__title {
  width: 100%;
  margin-bottom: 60px;
}

.detail__title .detail__titleName {
  width: 100%;
  text-align: center;
  font-size: 45px;
  font-size: 2.8125rem;
  line-height: 45px;
  line-height: 2.8125rem;
  font-weight: 700;
}

@media only screen and (max-width: 960px) {
  .detail__title {
    margin-bottom: 20px;
  }
  .detail__title .detail__titleName {
    font-size: 32px;
    font-size: 2rem;
    line-height: 3.25rem;
  }
}

.detail__imgshow {
  width: 100%;
  margin-bottom: 50px;
  position: relative;
}

.detail__imgshow .dots {
  padding: 20px 0;
}

.detail__imgshow .dots li span {
  background-color: #0d0505;
}

.detail__imgshow .dots .slick-active span {
  background-color: #ca0f19;
}

.detail__imgshow .detail__prev, .detail__imgshow .detail__next {
  z-index: 5;
  top: auto;
  bottom: 20px;
}

.detail__imgshow .detail__prev span::after, .detail__imgshow .detail__next span::after {
  background-color: #0d0505;
}

.detail__imglist {
  width: calc(33.3333% - 30px);
  margin: 0 15px;
  position: relative;
}

.detail__imglist .detail__imgLink {
  width: 100%;
  height: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.detail__imglist .detail__imgLink i {
  display: block;
  font-size: 65px;
  color: #ffffff;
  opacity: 0;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.detail__imglist .detail__imgLink:hover {
  background-color: rgba(202, 15, 25, 0.5);
}

.detail__imglist .detail__imgLink:hover i {
  opacity: 1;
}

.detail__imglist .detail__img {
  width: 100%;
  height: auto;
  display: block;
}

@media only screen and (max-width: 480px) {
  .detail__imglist {
    margin: 0;
  }
}

.detail-info {
  padding-bottom: 150px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

@media only screen and (max-width: 960px) {
  .detail-info {
    padding-bottom: 0;
  }
}

.detail-info__content {
  width: calc(50% - 20px);
}

@media only screen and (max-width: 960px) {
  .detail-info__content {
    width: 100%;
    margin-bottom: 80px;
  }
}

.detail-info__title {
  width: 100%;
  margin-bottom: 40px;
  text-align: center;
  position: relative;
}

.detail-info__title h3 {
  font-size: 30px;
  font-size: 1.875rem;
  line-height: 3.04688rem;
  padding: 0 20px;
  background-color: #ffffff;
  font-weight: bold;
  display: inline-block;
  position: relative;
  z-index: 2;
}

.detail-info__title::after {
  content: '';
  width: 100%;
  height: 1px;
  margin: auto;
  background-color: #cecece;
  position: absolute;
  left: 0;
  bottom: 18px;
}

.detail__edit {
  padding: 0 10px;
}

.detail__features {
  padding: 0 10px;
}

.detail__features .detail__featuresbox {
  width: 100%;
  position: relative;
}

.detail__features .detail__featuresbox .detail__featuresLink {
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 2;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.detail__features .detail__featuresbox .detail__featuresLink i {
  font-size: 50px;
  color: #ffffff;
  opacity: 0;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.detail__features .detail__featuresbox .detail__featuresLink:hover {
  background-color: rgba(202, 15, 25, 0.5);
}

.detail__features .detail__featuresbox .detail__featuresLink:hover i {
  opacity: 1;
}

.detail__features .detail__featuresbox .detail__featuresImg {
  width: 100%;
  height: auto;
  display: block;
}

.detail-info__content2 {
  width: 100%;
  margin-bottom: 30px;
}

.detail-btn {
  padding: 50px 0 100px 0;
  text-align: center;
}

.detail-btn .btn {
  margin: 0 10px;
}

.inq-fastlink {
  position: fixed;
  top: 30%;
  right: 20px;
  z-index: 10;
}

.inq-fastlink .inq-fastlink__btn {
  width: 87px;
  height: 87px;
  padding-top: 5px;
  -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
          box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-line-pack: center;
      align-content: center;
  border-radius: 10px;
  background-color: #ca0f19;
  -webkit-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}

.inq-fastlink .inq-fastlink__btn .inq__linkicon {
  width: 36px;
  height: 36px;
  border-radius: 5px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #ffffff;
}

.inq-fastlink .inq-fastlink__btn .inq__linkicon i {
  font-size: 24px;
  display: inline-block;
  color: #ca0f19;
}

.inq-fastlink .inq-fastlink__btn .inq__linkname {
  color: #ffffff;
}

.inq-fastlink .inq-fastlink__btn:hover {
  background-color: #ff4e00;
}

.inq-fastlink .inq-fastlink__btn:hover .inq__linkicon i {
  color: #ff4e00;
}

@media only screen and (max-width: 768px) {
  .inq-fastlink {
    top: 10%;
    right: 15px;
  }
  .inq-fastlink .inq-fastlink__btn {
    width: 50px;
    height: 50px;
    padding-top: 3px;
  }
  .inq-fastlink .inq-fastlink__btn .inq__linkicon {
    width: 20px;
    height: 20px;
  }
  .inq-fastlink .inq-fastlink__btn .inq__linkicon i {
    font-size: 14px;
  }
  .inq-fastlink .inq-fastlink__btn .inq__linkname {
    font-size: 10px;
    font-size: 0.625rem;
    line-height: 1.01563rem;
    font-weight: 400;
  }
}

/*=============products search===============*/
.products-search {
  width: 100%;
}

.products-search .products-search__title {
  font-weight: 700;
}

.products-search .form {
  width: 100%;
  margin-bottom: 15px;
}

.products-search .form .products-search__input {
  width: calc(50% - 122px);
  padding-right: 10px;
}

.products-search .form .products-search__btn .btn {
  margin: 0;
  border-radius: 8px;
  background-color: #ca0f19;
  color: #ffffff;
  border-color: #ca0f19;
}

.products-search .form .products-search__btn .btn:hover {
  background-color: #0d0505;
  border-color: #0d0505;
}

.products-search .products-search__keyword {
  margin-bottom: 10px;
  padding: 15px;
  background-color: #ffe9eb;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.82813rem;
  font-weight: bold;
}

/*inquiry*/
.inquiry-btn {
  position: fixed;
  right: 20px;
  left: auto;
  top: 200px;
}

.inquiry-img {
  width: 480px;
}

.inquiry-img img {
  width: 100%;
  display: block;
}

.inq-left {
  width: 25%;
  padding-left: 2.8%;
}

.inq-left .inq-left__img {
  width: 100%;
}

.inq-left .inq-left__img img {
  width: 100%;
  display: block;
}

@media only screen and (max-width: 1280px) {
  .inq-left {
    width: 30%;
  }
}

@media only screen and (max-width: 960px) {
  .inq-left {
    display: none;
  }
}

.inq-form {
  width: 100%;
  padding-left: 2.8%;
}

@media only screen and (max-width: 768px) {
  .inq-form {
    padding-left: 0;
  }
}

.inq-caption {
  padding: 0 10px;
  text-align: right;
  font-weight: 700;
}

.inq-caption span {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 2.03125rem;
}

@media only screen and (max-width: 960px) {
  .inq-caption {
    text-align: left;
  }
}

.inq__title {
  width: 25%;
  font-weight: 700;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.82813rem;
}

@media only screen and (max-width: 768px) {
  .inq__title {
    width: 100%;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
  }
}

.inq__input {
  width: 75%;
}

@media only screen and (max-width: 768px) {
  .inq__input {
    width: 100%;
    padding-top: 5px;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
  }
}

.inq__input2 {
  width: 150px;
}

.inq__input3 {
  width: calc(75% - 150px);
}

/*=============Contact===============*/
.contact {
  padding: 35px 10px 30px 10px;
}

.contact .btn2 {
  margin: 0;
}

@media only screen and (max-width: 960px) {
  .contact {
    padding-bottom: 40px;
  }
}

.contact__list {
  margin-bottom: 65px;
}

@media only screen and (max-width: 960px) {
  .contact__list {
    margin-bottom: 20px;
  }
}

.contact__item {
  padding: 0 0 10px 0;
}

.contact__item .contact__title {
  font-weight: 700;
}

.contact__map {
  width: 100%;
  padding-bottom: 41%;
  position: relative;
}

.contact__map iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
}

@media only screen and (max-width: 1440px) {
  .contact__map {
    padding-bottom: 60%;
  }
}

@media only screen and (max-width: 1080px) {
  .contact__map {
    padding-bottom: 80%;
  }
}

@media only screen and (max-width: 960px) {
  .contact__map {
    padding-bottom: 60%;
  }
}

@media only screen and (max-width: 480px) {
  .contact__map {
    padding-bottom: 100%;
  }
}

/*=============stock search===============*/
.search__wrap {
  padding-top: 30px;
}

@media only screen and (max-width: 960px) {
  .search__wrap {
    padding: 20px;
  }
}

.search {
  width: 100%;
  min-height: 658px;
  margin-bottom: 80px;
  padding: 20px 15px;
  border-radius: 15px;
  background-image: url("../images/stocksearch-bg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-line-pack: center;
      align-content: center;
  position: relative;
  overflow: hidden;
}

.search::after {
  content: '';
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  left: 0;
}

.search .search__login {
  width: 100%;
  max-width: 360px;
  position: relative;
  z-index: 2;
}

.search .search__login .all-left__title {
  text-align: center;
  margin-bottom: 40px;
}

.search .search__login .all-left__title .title-name {
  color: #ffffff;
}

.search .search__login .search__loginTitle {
  width: 100%;
  padding: 0 10px;
  color: #ffffff;
}

.search .search__login .search__loginInput {
  width: 100%;
  margin-bottom: 30px;
}

.search .search__login .search__btn {
  padding: 20px 0 0 0;
  text-align: center;
}

@media only screen and (max-width: 960px) {
  .search {
    margin-bottom: 30px;
  }
}

@media only screen and (max-width: 768px) {
  .search {
    min-height: 500px;
  }
}

.search-bar {
  width: 100%;
  padding: 20px 10px;
}

.search-bar .form__control {
  margin-bottom: 15px;
}

.search-bar .search-bar__btn1 {
  background-color: #ca0f19;
  border-color: #ca0f19;
}

.search-bar .search-bar__btn2 {
  background-color: #71707c;
  border-color: #71707c;
}

.search-bar .btn {
  margin: 0 0 15px 0;
}

.search-bar .btn span, .search-bar .btn i {
  color: #ffffff;
}

.search-bar .btn span {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 30px;
  line-height: 1.875rem;
}

.search-bar .btn:hover {
  background-color: #ff4e00;
  border-color: #ff4e00;
}

@media only screen and (max-width: 960px) {
  .search-bar .btn {
    width: calc(50% - 10px);
  }
  .search-bar .btn i {
    font-size: 21px;
  }
  .search-bar .search-bar__btn1 {
    margin-right: 15px;
  }
}

@media only screen and (max-width: 480px) {
  .search-bar .btn {
    width: 100%;
  }
  .search-bar .search-bar__btn1 {
    margin-right: 0;
  }
}

.search-keyword {
  padding: 0 15px 10px 15px;
  font-size: 25px;
  font-size: 1.5625rem;
  line-height: 2.53906rem;
  font-weight: 700;
}

@media only screen and (max-width: 480px) {
  .search-keyword {
    font-size: 22px;
    font-size: 1.375rem;
    line-height: 2.23438rem;
  }
}

.stock-top {
  margin-bottom: 15px;
  padding: 15px;
  border: 2px solid #ffd6d8;
  font-size: 18px;
  font-size: 1.125rem;
  line-height: 1.82813rem;
  font-weight: bold;
}

@media only screen and (max-width: 480px) {
  .stock-top {
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.625rem;
  }
}

.stock-table {
  width: 100%;
}

.stock-row {
  width: 100%;
  background-color: #f0f0f0;
}

.stock-row .stock-col {
  width: 33.333%;
  padding: 12px 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.stock-row:nth-child(even) {
  background-color: #ffffff;
}

.stock-row-header {
  background-color: #6c6c6c;
}

.stock-row-header .stock-col {
  color: #ffffff;
}

@media only screen and (max-width: 480px) {
  .stock-row .stock-col {
    padding: 5px 10px;
    word-wrap: break-word;
  }
}

/*=============about===============*/
.about__wrap {
  padding: 70px 0 30px 0;
  background-image: url("../images/about-bg.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #000;
  position: relative;
}

.about__wrap::after {
  content: '';
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

.about__wrap .about__box {
  padding: 0 2.5%;
  position: relative;
  z-index: 2;
}

.about__wrap .about__box .about__list {
  padding-bottom: 90px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.about__wrap .about__box .about__list .about__text {
  width: 40%;
}

.about__wrap .about__box .about__list .about__text ul {
  width: 100%;
}

.about__wrap .about__box .about__list .about__text ul li {
  margin-bottom: 20px;
  color: #ffffff;
}

.about__wrap .about__box .about__list .about__text ul li .about__kojex {
  display: inline-block;
  font-weight: 700;
  font-size: 23px;
  font-size: 1.4375rem;
  line-height: 2.33594rem;
  padding-right: 8px;
}

.about__wrap .about__box .about__list .about__imglist, .about__wrap .about__box .about__list .about__imglist2 {
  width: 60%;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-line-pack: start;
      align-content: flex-start;
}

.about__wrap .about__box .about__list .about__imglist .about__img, .about__wrap .about__box .about__list .about__imglist2 .about__img {
  border: 1px solid #ca0f19;
  position: relative;
}

.about__wrap .about__box .about__list .about__imglist .about__img img, .about__wrap .about__box .about__list .about__imglist2 .about__img img {
  width: 100%;
  display: block;
}

.about__wrap .about__box .about__list .about__imglist .about__img::after, .about__wrap .about__box .about__list .about__imglist2 .about__img::after {
  content: '';
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 0;
  left: 0;
}

.about__wrap .about__box .about__list .about__imglist .about__img {
  width: 48%;
}

.about__wrap .about__box .about__list .about__imglist .about__img:first-child {
  margin-right: 4%;
}

.about__wrap .about__box .about__list .about__imglist2 .about__img {
  width: 30.666%;
}

.about__wrap .about__box .about__list .about__imglist2 .about__img:nth-child(1), .about__wrap .about__box .about__list .about__imglist2 .about__img:nth-child(2) {
  margin-right: 4%;
}

.about__wrap .about__box .about__list:nth-child(1) .about__text {
  padding-right: 3%;
}

.about__wrap .about__box .about__list:nth-child(2) .about__text {
  padding-left: 3%;
}

@media only screen and (max-width: 1080px) {
  .about__wrap .about__box .about__list .about__text {
    width: 65%;
  }
  .about__wrap .about__box .about__list .about__imglist, .about__wrap .about__box .about__list .about__imglist2 {
    width: 35%;
  }
  .about__wrap .about__box .about__list .about__imglist .about__img {
    width: 100%;
  }
  .about__wrap .about__box .about__list .about__imglist .about__img:first-child {
    margin-right: 0;
    margin-bottom: 15px;
  }
  .about__wrap .about__box .about__list .about__imglist2 .about__img {
    width: 30.666%;
  }
  .about__wrap .about__box .about__list .about__imglist2 .about__img:nth-child(1), .about__wrap .about__box .about__list .about__imglist2 .about__img:nth-child(2) {
    margin-right: 4%;
  }
}

@media only screen and (max-width: 768px) {
  .about__wrap {
    padding: 30px 15px 20px 15px;
  }
  .about__wrap .about__box .about__list {
    padding-bottom: 40px;
  }
  .about__wrap .about__box .about__list .about__text {
    width: 100%;
  }
  .about__wrap .about__box .about__list .about__imglist, .about__wrap .about__box .about__list .about__imglist2 {
    width: 100%;
  }
  .about__wrap .about__box .about__list .about__imglist .about__img {
    width: 48%;
  }
  .about__wrap .about__box .about__list .about__imglist .about__img:first-child {
    margin-bottom: 0;
    margin-right: 4%;
  }
  .about__wrap .about__box .about__list .about__imglist2 .about__img {
    width: 30.666%;
  }
  .about__wrap .about__box .about__list .about__imglist2 .about__img:nth-child(1), .about__wrap .about__box .about__list .about__imglist2 .about__img:nth-child(2) {
    margin-right: 4%;
  }
  .about__wrap .about__box .about__list:nth-child(1) .about__text {
    padding-right: 0;
  }
  .about__wrap .about__box .about__list:nth-child(2) .about__text {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    padding-left: 0;
  }
  .about__wrap .about__box .about__list:nth-child(2) .about__imglist2 {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}

.about__title {
  width: 100%;
  max-width: 360px;
  margin: 0 auto 60px auto;
  position: relative;
  z-index: 2;
  text-align: center;
}

@media only screen and (max-width: 768px) {
  .about__title {
    margin-bottom: 20px;
  }
}

.about__wrap2 {
  padding: 80px 0;
}

.about__wrap2 .about__title {
  margin-bottom: 40px;
}

@media only screen and (max-width: 960px) {
  .about__wrap2 {
    padding: 50px 15px;
  }
  .about__wrap2 .about__title {
    margin-bottom: 30px;
  }
}

.mission__text {
  padding: 0 15px 80px 15px;
  text-align: center;
}

.mission__text .mission__kojex {
  font-size: 23px;
  font-size: 1.4375rem;
  line-height: 2.33594rem;
  font-weight: 700;
}

@media only screen and (max-width: 960px) {
  .mission__text {
    padding-bottom: 50px;
  }
}

@media only screen and (max-width: 480px) {
  .mission__text {
    max-width: 360px;
    margin: 0 auto;
    padding: 0 5px 30px 5px;
    text-align: left;
  }
}

.mission {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.mission .mission__list {
  width: 25%;
  padding: 0 3%;
  text-align: center;
}

.mission .mission__list .mission__img {
  width: 50%;
  margin: 0 auto 20px auto;
}

.mission .mission__list .mission__img span {
  width: 100%;
  display: block;
  padding-bottom: 100%;
  background-color: #f0f0f0;
  border-radius: 999px;
  position: relative;
}

.mission .mission__list .mission__img span i {
  font-size: 3.8vw;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  color: #6c6c6c;
}

.mission .mission__list .mission__title {
  margin-bottom: 15px;
  font-size: 30px;
  font-size: 1.875rem;
  line-height: 40px;
  line-height: 2.5rem;
  font-weight: 700;
  text-transform: uppercase;
}

.mission .mission__list .mission__word {
  padding: 0 5px;
}

@media only screen and (max-width: 960px) {
  .mission .mission__list {
    width: 50%;
    margin-bottom: 30px;
  }
  .mission .mission__list .mission__img {
    margin-bottom: 15px;
  }
  .mission .mission__list .mission__img span i {
    font-size: 9vw;
  }
}

@media only screen and (max-width: 768px) {
  .mission .mission__list .mission__title {
    font-size: 25px;
    font-size: 1.5625rem;
    line-height: 35px;
    line-height: 2.1875rem;
  }
}

@media only screen and (max-width: 480px) {
  .mission .mission__list {
    width: 100%;
    padding: 0 5px;
    margin-bottom: 30px;
  }
  .mission .mission__list .mission__img {
    margin-bottom: 10px;
  }
  .mission .mission__list .mission__img span i {
    font-size: 21vw;
  }
}

.animated {
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-duration: 1s;
  animation-fill-mode: both;
  opacity: 1;
}

@-webkit-keyframes fadeInUpBig {
  from {
    -webkit-transform: translate3d(0, 2000px, 0);
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
  to {
    -webkit-transform: none;
    opacity: 1;
    transform: none;
  }
}

@keyframes fadeInUpBig {
  from {
    -webkit-transform: translate3d(0, 2000px, 0);
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
  to {
    -webkit-transform: none;
    opacity: 1;
    transform: none;
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

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