html, body, .index-page { position: relative; height: 100%; }

body { margin: 0; padding: 0; }

.page-section .section { position: relative; }
.page-section .section .section-wrap { position: relative; z-index: 2; }
.page-section .section .bg { position: absolute; top: 0; bottom: 0; right: 0; left: 0; z-index: 0; }
.page-section .section:nth-child(2) .bg { background: url("../Image/index/sec-2-bg.jpg"); }
.page-section .section:nth-child(3) .bg { background: url("../Image/index/sec-3-bg.jpg"); }
.page-section .section:nth-child(4) .bg { background: url("../Image/index/sec-4-bg.jpg"); }

.sec-2-img { display: block; position: absolute; bottom: 0; right: 0; width: 48.43vw; height: 42.86vw; bottom: 0; }

.about-wrap { padding-left: 3%; }
.about-wrap .sec-name { position: relative; margin-bottom: 3rem; }
.about-wrap .sec-name::before { content: 'xindiana'; font-family: Lovelo; position: absolute; top: -18px; font-size: 130px; line-height: 1; opacity: .1; z-index: 0; }
.about-wrap .sec-name::after { content: ''; display: block; width: 100px; height: 5px; background-color: var(--theme-red); margin-top: 2rem; }
.about-wrap .sec-name .cn-name { color: var(--theme-red); font-size: 36px; font-weight: bold; position: relative; z-index: 2; }
.about-wrap .sec-name .en-name { position: relative; z-index: 2; font-size: 1.125rem; color: #343434; letter-spacing: 2px; }
.about-wrap .about-con { color: #666666; }
.about-wrap .about-con p { line-height: 34px; margin-bottom: 30px; }
.about-wrap .about-param { margin-bottom: 2rem; }
.about-wrap .about-param .param-item { text-align: center; }
.about-wrap .about-param .param-item:nth-child(2) { flex: 0 0  38.5%; max-width: 38.5%; border-left: 1px solid #e3e4e6; border-right: 1px solid #e3e4e6; }
.about-wrap .about-param .param-item .item-num { color: #666666; line-height: 1; }
.about-wrap .about-param .param-item .item-num strong { font-size: 76px; font-weight: bold; color: var(--theme-red); font-family: lovelo; }
.about-wrap .about-param .param-item p { color: #999999; }
.about-wrap .about-more { background-color: var(--theme-red); color: var(--white); width: 155px; height: 42px; text-align: center; line-height: 42px; font-family: Arial; border-radius: 3px; }

.product-wrap .pro-tit { color: #ffffff; font-size: 1.5rem; line-height: 36px; }
.product-wrap .pro-desc { line-height: 28px; color: #ffffff; opacity: .6; width: 75%; }
@media (max-width: 1199.98px) { .product-wrap .pro-desc { width: 80%; } }
@media (max-width: 575.98px) { .product-wrap .pro-desc { width: 100%; } }
.product-wrap .more-btn { background-color: var(--theme-red); color: #ffffff; width: 145px; height: 38px; text-align: center; line-height: 38px; }
.product-wrap .product-swiper .pro-item .item-caption { background-color: #ececec; text-align: center; }
.product-wrap .product-swiper .pro-item .item-caption .item-name { font-size: 1.125rem; color: #333333; line-height: 2; }
.product-wrap .product-swiper .pro-item .item-caption .item-desc { color: #999999; }

.news-wrap .head .head-name .cn-name { font-size: 26px; }
.news-wrap .head .head-name .en-name { font-size: .875rem; color: #999999; line-height: 2; }
.news-wrap .head .head-name::after { content: ''; display: block; width: 50px; height: 2px; margin-top: 2rem; background-color: var(--theme-red); }
.news-wrap .head .head-category a { display: block; width: 96px; height: 32px; line-height: 32px; text-align: center; background-color: #dddddd; color: #666666; font-size: .875rem; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; margin: 0 3px; }
.news-wrap .head .head-category a:hover { color: #ffffff; background-color: var(--theme-red); }

.news-swiper { padding: 1rem 0; }
.news-swiper .news-item .item-wrap { background-color: #ffffff; padding-bottom: 2rem; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; }
.news-swiper .news-item .item-img { padding-bottom: 60.526%; }
.news-swiper .news-item .item-caption { padding: 0 5%; }
.news-swiper .news-item .item-caption .item-name { color: #666666; font-size: 1.125rem; line-height: 32px; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; }
.news-swiper .news-item .item-caption .item-name::before { content: ''; display: block; width: 40px; height: 2px; background-color: var(--theme-red); margin: 1.5rem 0; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; }
.news-swiper .news-item .item-caption .item-desc { margin-top: 1rem; color: #999999; font-size: .875rem; line-height: 30px; }
.news-swiper .news-item .item-caption .item-more { display: block; padding-top: 1.5rem; color: #6b6b6b; font-size: 12px; }
.news-swiper .news-item .item-caption .item-more span { margin-right: 10px; display: inline-block; vertical-align: middle; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; }
.news-swiper .news-item .item-caption .item-more i { display: inline-block; vertical-align: middle; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; }
.news-swiper .news-item:hover .item-wrap { -webkit-box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05); -moz-box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05); box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05); }
.news-swiper .news-item:hover .item-name { color: var(--theme-red); }
.news-swiper .news-item:hover .item-name::before { width: 60px; }
.news-swiper .news-item:hover .item-more { color: var(--theme-red); }
.news-swiper .news-item:hover .item-more span { letter-spacing: 1px; }
.news-swiper .news-item:hover .item-more i { -webkit-transform: translateX(3px); -moz-transform: translateX(3px); -ms-transform: translateX(3px); -o-transform: translateX(3px); transform: translateX(3px); }

@media (max-width: 575.98px) { .about-wrap .sec-name { margin-top: 1rem; margin-bottom: .5rem; }
  .about-wrap .sec-name::before { font-size: 70px; top: 0; }
  .about-wrap .sec-name::after { margin-top: .5rem; }
  .about-wrap .sec-name .cn-name { font-size: 28px; }
  .about-wrap .sec-name .en-name { font-size: 12px; }
  .about-wrap .about-con p { margin-bottom: auto; }
  .about-wrap .about-param { margin-bottom: 1rem; }
  .about-wrap .about-param .param-item .item-num strong { font-size: 32px; }
  .news-wrap .head .head-name .cn-name { font-size: 26px; }
  .news-wrap .head .head-name .en-name { font-size: .875rem; color: #999999; line-height: 2; }
  .news-wrap .head .head-name::after { margin-top: .5rem; }
  .news-swiper .news-item .item-wrap { padding-bottom: 1rem; }
  .news-swiper .news-item .item-caption { padding: 0 5%; }
  .news-swiper .news-item .item-caption .item-name::before { margin: .5rem 0; }
  .news-swiper .news-item .item-caption .item-more { padding-top: .5rem; } }
.banner-swiper .item-1 .item-txt { width: 42%; }
.banner-swiper .item-1 .item-pro { width: 38%; }

@media (max-width: 767.98px) { .banner-swiper .item-1 .item-txt { width: 75%; }
  .banner-swiper .item-1 .item-pro { width: 58%; } }
@media (max-width: 575.98px) { .banner-swiper .item-1 .item-txt { width: 60%; }
  .banner-swiper .item-1 .item-pro { width: 48%; } }
@media (min-width: 576px) { .about-wrap .sec-name { margin-bottom: 1rem; }
  .about-wrap .sec-name::before { font-size: 100px; }
  .about-wrap .sec-name::after { margin-top: 1rem; }
  .about-wrap .about-con p { margin-bottom: 1rem; }
  .about-wrap .about-param .param-item .item-num strong { font-size: 52px; }
  .news-wrap .head .head-name .cn-name { font-size: 26px; }
  .news-wrap .head .head-name .en-name { font-size: .875rem; color: #999999; line-height: 2; }
  .news-wrap .head .head-name::after { margin-top: 1rem; }
  .news-swiper .news-item .item-wrap { padding-bottom: 1rem; }
  .news-swiper .news-item .item-caption { padding: 0 5%; }
  .news-swiper .news-item .item-caption .item-name::before { margin: .5rem 0; }
  .news-swiper .news-item .item-caption .item-more { padding-top: .5rem; } }
@media (min-width: 768px) { .about-wrap .sec-name::before { font-size: 130px; }
  .about-wrap .about-param .param-item .item-num strong { font-size: 76px; }
  .about-wrap .about-con p { margin-bottom: 1.5rem; } }
@media (min-width: 1200px) { .banner-swiper .item-1 .item-txt { width: 50%; }
  .banner-swiper .item-1 .item-pro { width: 48%; }
  .about-wrap .about-con p { margin-bottom: 30px; }
  .news-swiper .news-item .item-wrap { padding-bottom: 1rem; }
  .news-swiper .news-item .item-caption .item-name::before { margin: 1.5rem 0; }
  .news-swiper .news-item .item-caption .item-more { padding-top: 1.5rem; } }