/*header*/
#header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 8;
  background-color: #fff;
  --opacity: 0.1;
  border-bottom: 0.01rem solid rgba(0, 0, 0, var(--opacity));
}
#header .inner {
  position: relative;
  padding: 0.2rem 0;
}
#header:not(.fixed)#header:not(.white) {
  background-color: transparent;
  border-bottom: transparent;
}
/*logo*/
#logo {
  width: 2rem;
  position: relative;
  z-index: 10;
}
#logo a {
  display: block;
  overflow: hidden;
  padding-bottom: 35%;
  position: relative;
}
#logo i {
  position: absolute;
  width: 100%;
  height: 100%;
  text-indent: -99999em;
  display: block;
  overflow: hidden;
  background: no-repeat left center;
  background-size: contain;
}
@media only screen and (max-width: 750px) {
  #logo {
    width: 1.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #button {
    font-size: 0.16rem;
  }
}
/*language*/
#language {
  position: relative;
}
#language span {
  --opacity: 0.2;
  border: 0.02rem solid rgba(153, 153, 153, var(--opacity));
  width: 6.66666667em;
  height: 2.77777778em;
  border-radius: 1.38888889em;
  position: relative;
  white-space: nowrap;
  cursor: pointer;
}
#language span:after {
  width: 0.88888889em;
  height: 0.5em;
  background: url(../images/language_arrow.svg) no-repeat center center;
  background-size: contain;
  display: block;
  content: '';
  margin-left: 0.77777778em;
}
#language span:hover,
#language span.active {
  background-color: var(--main-color);
  color: #fff;
  border-color: transparent;
}
#language span:hover:after,
#language span.active:after {
  filter: brightness(100);
}
#language .drop {
  position: absolute;
  top: 100%;
  left: 50%;
  min-width: 2rem;
  padding-top: 0.4rem;
  z-index: 5;
  --x: -50%;
}
#language ul {
  --opacity: 0.9;
  background-color: rgba(255, 255, 255, var(--opacity));
  box-shadow: 0px 0px 0.16rem 0px rgba(4, 4, 4, 0.08);
  text-align: center;
  padding: 0.5em 1.5em;
  border-radius: 0.2rem;
}
#language ul li {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
#language ul li:last-child {
  border-bottom: none;
}
#language ul a {
  white-space: nowrap;
  display: block;
  padding: 0.5em 0;
}
#header:not(.fixed)#header:not(.white) #language span {
  color: #fff;
  border-color: rgba(255, 255, 255, var(--opacity));
}
#header:not(.fixed)#header:not(.white) #language span:after {
  filter: brightness(100);
}
#header:not(.fixed)#header:not(.white) #language span:hover,
#header:not(.fixed)#header:not(.white) #language span.active {
  background-color: var(--main-color);
  border-color: transparent;
}
@media only screen and (max-width: 750px) {
  #header .inner {
    padding: 0.15rem 0;
  }
}
/*navbtn*/
#navbtn {
  display: none;
}
@media only screen and (max-width: 1024px) {
  /*1024*/
  #navbtn {
    position: relative;
    cursor: pointer;
    width: 1.66666667em;
    height: 1.66666667em;
    display: block;
    z-index: 10;
    overflow: hidden;
    margin-left: 1.66666667em;
  }
  #navbtn:before,
  #navbtn:after,
  #navbtn i {
    width: 100%;
    height: 0.11111111em;
    background-color: #222;
    display: block;
    position: absolute;
    left: 0;
    transition: all 0.3s;
    content: '';
  }
  #navbtn:before {
    top: 0.05555556em;
  }
  #navbtn:after {
    bottom: 0.05555556em;
  }
  #navbtn i {
    top: 50%;
    transform: translateY(-50%);
  }
  #navbtn.active {
    overflow: visible;
  }
  #navbtn.active:before {
    transform: rotate(45deg);
    top: 50%;
  }
  #navbtn.active:after {
    transform: rotate(-45deg);
    bottom: auto;
    top: 50%;
  }
  #navbtn.active i {
    opacity: 0;
  }
  #header:not(.fixed)#header:not(.white) #navbtn {
    filter: brightness(100);
  }
}
/*navi*/
#navi {
  width: calc(100% - 3.2rem);
  line-height: 2.5em;
  padding: 0 0.38rem;
  --y: 0;
}
#navi a {
  display: block;
  position: relative;
}
#navi .parent {
  padding: 0 0.27rem;
  position: relative;
}
#navi .drop {
  font-size: 0.9em;
}
@media only screen and (min-width: 1025px) {
  #navi {
    opacity: 1;
    visibility: visible;
  }
  #navi .on > a,
  #navi .cur > a {
    color: var(--main-color);
  }
  #navi .drop {
    position: absolute;
    top: 100%;
    left: 50%;
    min-width: 1.8rem;
    --x: -50%;
    z-index: 5;
    text-align: center;
    padding-top: 0.4rem;
  }
  #navi .drop ul {
    --opacity: 0.9;
    background-color: rgba(255, 255, 255, var(--opacity));
    box-shadow: 0px 0px 0.16rem 0px rgba(4, 4, 4, 0.08);
    text-align: center;
    padding: 0.5em 1.5em;
    border-radius: 0.2rem;
  }
  #navi .drop ul li {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }
  #navi .drop ul li:last-child {
    border-bottom: none;
  }
  #navi .drop ul a {
    white-space: nowrap;
    display: block;
  }
  #navi .on .drop {
    --y: 0;
    opacity: 1;
    visibility: visible;
  }
  #header:not(.fixed)#header:not(.white) #navi .parent > a {
    color: #fff;
  }
}
@media only screen and (max-width: 1280px) {
  #navi {
    padding: 0 0.2rem;
  }
  #navi .parent {
    padding: 0 0.18rem;
  }
}
@media only screen and (max-width: 1024px) {
  /*1024px*/
  #navi {
    position: fixed;
    width: calc(100% - 0.2rem);
    max-width: calc(30em - 0.2rem);
    height: calc(100% - 1.3rem);
    --opacity: 0.9;
    background-color: rgba(255, 255, 255, var(--opacity));
    z-index: 9;
    right: 0;
    top: 1.2rem;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0.5rem 0;
    --x: 100%;
    transition: all 0.3s;
    border-radius: 0.2rem;
    box-shadow: 0px 0px 0.16rem 0px rgba(4, 4, 4, 0.08);
  }
  #navi.active {
    --x: 0;
    right: 0.1rem;
  }
  #navi .menu {
    display: block;
  }
  #navi .parent {
    padding: 0 0.5rem;
    line-height: 2em;
    position: relative;
  }
  #navi .parent > a {
    padding: 1.25em 0;
    border-bottom: 1px solid #e4e4e4;
  }
  #navi em {
    display: block;
    position: absolute;
    right: 0.3rem;
    width: 4.55555556em;
    height: 4.55555556em;
    z-index: 2;
    top: 0;
    cursor: pointer;
  }
  #navi em:after {
    width: 0.66666667em;
    height: 0.66666667em;
    border-right: 0.05555556em solid #333;
    border-bottom: 0.05555556em solid #333;
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: rotate(-45deg);
    background-color: transparent;
    margin: -0.38888889em 0 0 -0.38888889em;
    transition: inherit;
  }
  #navi .on > em:after {
    transform: rotate(45deg);
  }
  #navi .drop {
    transition: none;
    --y: 0;
    visibility: visible;
    opacity: 1;
    display: none;
  }
  #navi .drop ul {
    background-color: transparent;
    box-shadow: none;
    padding: 1em 0 1em 2em;
    text-align: left;
  }
  #navi .drop a {
    padding: 0.75em 0;
  }
}
@media only screen and (max-width: 750px) {
  #navi {
    padding: 0.3rem 0;
    height: calc(100% - 1.021rem);
    top: 0.921rem;
  }
  #navi .parent {
    padding: 0 0.3rem;
  }
  #navi em {
    right: 0;
  }
}
/*footer*/
#footer {
  --opacity: 0.85;
  background: rgba(0, 0, 0, var(--opacity)) url(../images/footer_bg_logo.png) no-repeat right bottom;
  background-size: 35.3125% auto;
  color: #fff;
  padding: 0.5rem 0 0.43rem;
  position: relative;
}
#footer a:not(:hover) {
  color: #fff;
}
@media only screen and (max-width: 750px) {
  #footer {
    padding: 0;
  }
}
/*copyright*/
#copyright {
  padding: 0.28rem 0;
  --opacity: 0.2;
  color: rgba(255, 255, 255, var(--opacity));
  line-height: 1.875em;
}
#copyright a {
  display: inline-block;
}
#copyright a:not(:hover) {
  color: rgba(255, 255, 255, var(--opacity));
}
@media only screen and (max-width: 1024px) {
  /*1024px*/
  #copyright {
    flex-direction: column;
    text-align: center;
    justify-content: center;
    align-items: center;
  }
}
/*bottom*/
#bottom {
  --opacity: 0.2;
  border-bottom: 1px solid rgba(255, 255, 255, var(--opacity));
  padding: 0.35rem 0;
}
#bottom .top,
#bottom .btm {
  padding: 0.25rem 0;
}
@media only screen and (max-width: 750px) {
  #bottom {
    padding: 0.25rem 0;
  }
}
/*site*/
#site {
  width: 2.85rem;
  max-width: 100%;
}
#site img {
  display: block;
  width: 100%;
  margin: 0 auto;
}
@media only screen and (max-width: 1024px) {
  #site {
    margin: 0 auto;
  }
}
/*menu*/
#menu {
  width: calc(100% - 2.85rem);
  padding-left: 7.25%;
}
#menu dl {
  max-width: 1.65rem;
}
#menu dt {
  margin-bottom: 1.7em;
}
#menu dd {
  font-size: 0.8em;
  line-height: 1.35em;
  margin-bottom: 1.25em;
}
#menu dd:last-child {
  margin-bottom: 0;
}
#menu dd a:not(:hover) {
  --opacity: 0.6;
  color: rgba(255, 255, 255, var(--opacity));
}
@media only screen and (max-width: 1024px) {
  #menu {
    width: 100%;
    padding-left: 0;
    margin-top: 0.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #menu {
    display: none;
  }
}
/*infor*/
#infor {
  width: 5rem;
  max-width: 100%;
  --opacity: 0.6;
  color: rgba(255, 255, 255, var(--opacity));
  line-height: 1.5em;
}
#infor p {
  padding-left: 2.75em;
  background: no-repeat left 0.0625em;
  background-size: 1.375em auto;
  margin-bottom: 1.25em;
}
#infor p:last-child {
  margin-bottom: 0;
}
#infor .tel {
  background-image: url(../images/infor_icon_tel.svg);
}
#infor .mail {
  background-image: url(../images/infor_icon_mail.svg);
}
#infor .add {
  background-image: url(../images/infor_icon_add.svg);
}
@media only screen and (max-width: 750px) {
  #infor {
    width: 100%;
  }
}
/*social*/
#social li {
  margin-right: 0.2rem;
  position: relative;
  margin-top: 0.2rem;
}
#social li:last-child {
  margin-right: 0;
}
#social a {
  display: block;
  overflow: hidden;
  width: 0.4rem;
  --opacity: 0.2;
  background-color: rgba(255, 255, 255, var(--opacity));
  border-radius: 50%;
}
#social a:hover {
  background-color: var(--main-color);
}
#social i {
  display: block;
  overflow: hidden;
  padding-bottom: 100%;
  background: no-repeat center center;
  background-size: 55% auto;
}
#social .qr {
  position: absolute;
  left: 50%;
  bottom: 100%;
  --x: -50%;
  --y: 0;
  margin-bottom: 1em;
  width: 1.3rem;
  --opacity: 0.9;
  background-color: rgba(255, 255, 255, var(--opacity));
  box-shadow: 0px 0px 0.16rem 0px rgba(4, 4, 4, 0.08);
  text-align: center;
  padding: 0.1rem;
  border-radius: 0.2rem;
}
#social .qr:after {
  border-top: 0.1rem solid rgba(255, 255, 255, var(--opacity));
  border-left: 0.1rem solid transparent;
  border-right: 0.1rem solid transparent;
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 100%;
  transition: inherit;
}
#social .qr img {
  display: block;
  width: 100%;
  height: auto;
}
@media only screen and (max-width: 1024px) {
  #social .qr {
    width: 1.1rem;
  }
}
@media only screen and (max-width: 750px) {
  #social {
    width: 100%;
  }
  #social ul {
    justify-content: center;
  }
  #social .qr {
    width: 1.4rem;
  }
}
/*backtop*/
#backtop {
  background: var(--main-color) url(../images/backtop.svg) no-repeat center center;
  background-size: 26.66666667% auto;
  cursor: pointer;
  width: 0.6rem;
  border-radius: 50%;
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 3.125%;
  transform: translateY(-50%);
  z-index: 5;
}
#backtop:after {
  display: block;
  padding-bottom: 100%;
  content: '';
}
/*button-more*/
.button-more .go {
  width: 10em;
  height: 3.33333333em;
  border-radius: 1.66666667em;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--main-color);
  border: 0.02rem solid var(--main-color);
  position: relative;
  overflow: hidden;
}
.button-more .go:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 1.66666667em;
  left: 0;
  --opacity: 0.1;
  background-color: rgba(255, 255, 255, var(--opacity));
  transition: inherit;
  transform: translateX(-100%);
}
.button-more .go:hover {
  background-color: var(--main-color);
  color: #fff;
  border-color: transparent;
}
.button-more .white {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.2);
}
.button-more .fill {
  background-color: var(--main-color);
  color: #fff;
  border-color: transparent;
}
.button-more .fill:hover:before {
  transform: translateX(0);
}
.button-more i {
  display: block;
  font-style: normal;
  position: relative;
  z-index: 2;
}
@media only screen and (max-width: 1024px) {
  .button-more .go {
    font-size: 0.16rem;
  }
}
@media only screen and (max-width: 750px) {
  .button-more .go {
    font-size: 0.14rem;
  }
}
/*swiper-arrows*/
.swiper-arrows .arrow {
  --opacity: 0.3;
  border: 0.02rem solid rgba(0, 0, 0, var(--opacity));
  border-radius: 50%;
  width: 0.6rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  cursor: pointer;
}
.swiper-arrows .arrow:before {
  display: block;
  content: '';
  padding-bottom: 100%;
}
.swiper-arrows .arrow:after {
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 15.51724138%;
  padding-bottom: 27.5862069%;
  background: no-repeat center center;
  background-size: contain;
  filter: invert(1) brightness(0);
  opacity: var(--opacity);
}
.swiper-arrows .arrow:hover {
  --opacity: 1;
  border-color: var(--main-color);
}
.swiper-arrows .arrow:hover:after {
  filter: invert(0);
}
.swiper-arrows .prev {
  left: -1.2rem;
}
.swiper-arrows .prev:after {
  background-image: url(../images/swiper_prev_01.svg);
}
.swiper-arrows .next {
  right: -1.2rem;
}
.swiper-arrows .next:after {
  background-image: url(../images/swiper_next_01.svg);
}
.swiper-arrows .abs {
  position: relative;
  transform: none;
  top: auto;
  left: auto;
  right: auto;
}
.swiper-arrows .fill:hover {
  background-color: var(--main-color);
  border-color: transparent;
}
.swiper-arrows .fill:hover:after {
  filter: brightness(100);
}
@media only screen and (max-width: 1024px) {
  .swiper-arrows .arrow {
    width: 0.5rem;
  }
}
@media only screen and (max-width: 750px) {
  .swiper-arrows .arrow {
    width: 0.35rem;
  }
}
/*swiper-control*/
.swiper-control .bar {
  width: 5rem;
  max-width: 100%;
}
.swiper-control .pagination.swiper-pagination-progressbar {
  width: calc(100% - 1rem);
  background-color: rgba(241, 241, 241, 0.5);
  height: 0.02rem;
  border-radius: 0.01rem;
  position: relative;
  left: auto;
  top: auto;
}
.swiper-control .pagination .swiper-pagination-progressbar-fill {
  background-color: var(--main-color);
}
.swiper-control .total {
  opacity: 0.5;
}
/*slides*/
#slides .figure {
  padding-bottom: 50%;
}
#slides .img {
  transform: scale(1.5);
  transition-duration: 3s;
}
#slides .text {
  position: absolute;
  top: 50%;
  transform: translateY(30%);
  left: 0;
  width: 100%;
  z-index: 2;
  opacity: 0;
}
#slides .info {
  max-width: 24em;
}
#slides .title {
  font-size: 2.66666667em;
  line-height: 1.2em;
  padding: 0.15em 0;
  letter-spacing: -0.025em;
}
#slides .intro {
  line-height: 1.2em;
  padding: 0.4em 0;
}
#slides .button-more {
  margin-top: 2.66666667em;
}
#slides .swiper-control {
  position: absolute;
  left: 0;
  bottom: 7.70833333%;
  width: 100%;
  z-index: 5;
}
#slides .swiper-slide-duplicate-active .img,
#slides .swiper-slide-active .img {
  transform: scale(1);
}
#slides .swiper-slide-duplicate-active .text,
#slides .swiper-slide-active .text {
  transform: translateY(-50%);
  opacity: 1;
}
@media only screen and (max-width: 1280px) {
  #slides .info {
    font-size: 0.28rem;
  }
}
@media only screen and (max-width: 1024px) {
  #slides .info {
    font-size: 0.22rem;
  }
}
@media only screen and (max-width: 750px) {
  #slides .figure {
    padding-bottom: 100%;
  }
  #slides .info {
    font-size: 0.18rem;
  }
  #slides .title {
    font-size: 2.2em;
  }
}
/*module-bar*/
.module-bar {
  margin-bottom: 0.5rem;
}
@media only screen and (max-width: 750px) {
  .module-bar {
    margin-bottom: 0.35rem;
  }
}
/*module-name*/
.module-name {
  margin: 0;
  font-size: 0.68rem;
  line-height: 1.125em;
}
@media only screen and (max-width: 1024px) {
  .module-name {
    font-size: 0.58rem;
  }
}
@media only screen and (max-width: 750px) {
  .module-name {
    font-size: 0.4rem;
  }
}
/*noban*/
.noban #header {
  position: sticky;
}
/*container*/
#container {
  padding: 0.3rem 0 0.95rem;
}
@media only screen and (max-width: 750px) {
  #container {
    padding-bottom: 0.7rem;
  }
}
/*breadcrumb*/
.breadcrumb a {
  display: block;
}
.breadcrumb a:not(:hover) {
  color: #666;
}
.breadcrumb i {
  display: block;
  width: 0.27777778em;
  height: 0.55555556em;
  background: url(../images/breadcrumb_arrow.svg) no-repeat center center;
  background-size: contain;
  margin: 0 0.55555556em;
}
.breadcrumb span {
  display: block;
}
/*circle-more*/
.circle-more .go {
  display: block;
  overflow: hidden;
  width: 0.6rem;
  background: var(--main-color) url(../images/circle_more.svg) no-repeat center center;
  background-size: 15% auto;
  border-radius: 50%;
}
.circle-more .go:after {
  display: block;
  content: '';
  padding-bottom: 100%;
}
@media only screen and (max-width: 750px) {
  .circle-more .go {
    width: 0.35rem;
  }
}
/*news-item*/
.news-item .info {
  border-bottom: 0.01rem solid rgba(0, 0, 0, var(--opacity));
  padding: 0.3rem 0;
}
.news-item .td {
  vertical-align: top;
}
.news-item .date {
  --opacity: 0.8;
  color: rgba(0, 0, 0, var(--opacity));
  width: 13.33333333em;
}
.news-item .date time {
  background: url(../images/date_01.svg) no-repeat left center;
  background-size: 1.05555556em auto;
  padding-left: 1.77777778em;
}
.news-item .pic {
  width: 2.5rem;
}
.news-item .figure {
  padding-bottom: 56%;
}
.news-item .text {
  padding: 0 0.3rem;
}
.news-item .box {
  position: relative;
  max-width: 7.5rem;
}
.news-item .circle-more {
  position: absolute;
  left: 0;
  bottom: 0;
  opacity: 0;
}
@media only screen and (min-width: 1025px) {
  .news-item .info:hover .pic {
    width: 5.6rem;
  }
  .news-item .info:hover .box {
    max-width: 6.1rem;
    padding-bottom: 1.1rem;
  }
  .news-item .info:hover .circle-more {
    opacity: 1;
  }
  .news-item .info:hover .title {
    font-size: 0.3rem;
    font-weight: bold;
  }
}
@media only screen and (max-width: 750px) {
  .news-item .info {
    padding-bottom: 0.35rem;
  }
  .news-item .table {
    display: block;
  }
  .news-item .td {
    display: block;
    width: 100%;
  }
  .news-item .text {
    padding: 0.2rem 0;
  }
}
/*media*/
#media {
  padding: 1.3rem 0 1.4rem;
}
#media .list {
  --opacity: 0.1;
  border-top: 0.01rem solid rgba(0, 0, 0, var(--opacity));
  margin-bottom: 0.6rem;
}
@media only screen and (max-width: 750px) {
  #media {
    padding: 0.5rem 0 0.6rem;
  }
  #media .list {
    margin-bottom: 0.4rem;
  }
}
/*development*/
#development {
  background: no-repeat center center;
  background-size: cover;
  overflow: hidden;
  min-height: 9.6rem;
}
#development .module-bar {
  padding: 8.125% 0;
}
#development .list {
  overflow: hidden;
  width: 100%;
}
#development .item {
  width: 29.16666667%;
  flex-grow: 1;
}
#development .title {
  --opacity: 0.6;
  color: rgba(0, 0, 0, var(--opacity));
  height: 4em;
  margin-bottom: 0.1rem;
}
#development .figure {
  width: 1.78rem;
}
#development .figure:after {
  display: block;
  padding-bottom: 56.17977528%;
}
#development .circle-more {
  opacity: 0;
}
#development .info {
  display: block;
  overflow: hidden;
  background-color: #ccc;
  padding: 0.3rem 0.4rem 0.4rem;
}
@media only screen and (min-width: 751px) {
  #development .active {
    width: 41.66666667%;
  }
  #development .active .info {
    background-color: rgba(255, 255, 255, 0.95);
  }
  #development .active .title {
    --opacity: 1;
    font-size: 0.3rem;
    font-weight: bold;
    margin-bottom: 1em;
  }
  #development .active .circle-more {
    opacity: 1;
  }
  #development .active .figure {
    width: 3rem;
  }
}
@media only screen and (max-width: 1024px) {
  #development {
    min-height: 6.4rem;
  }
  #development .title {
    font-size: 0.18rem;
  }
  #development .info {
    padding: 0.2rem 0.25rem 0.25rem;
  }
  #development .active .title {
    font-size: 0.22rem;
  }
  #development .active .figure {
    width: 2.5rem;
  }
}
@media only screen and (max-width: 750px) {
  #development {
    min-height: 0;
  }
  #development .module-bar {
    padding: 0.5rem 0;
  }
  #development .module-name {
    margin-bottom: 0.2rem;
  }
  #development .list {
    flex-direction: column;
  }
  #development .item {
    width: 100%;
  }
  #development .title {
    font-size: 0.24rem;
  }
  #development .circle-more {
    opacity: 1;
  }
  #development .info {
    padding: 0.3rem 0.35rem 0.35rem;
  }
  #development .item:nth-child(2n) .info {
    background-color: rgba(255, 255, 255, 0.95);
  }
}
/*product*/
#product {
  padding: 0.6rem 0;
  overflow: hidden;
}
#product .list {
  overflow: hidden;
}
#product .swiper {
  width: 13.4rem;
  max-width: 69.79166667%;
  overflow: visible;
}
#product .figure {
  padding-bottom: 50%;
}
#product .figure:after {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  --opacity: 0.6;
  background-color: rgba(0, 0, 0, var(--opacity));
  transition: all 0.3s;
}
#product .text {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 4.47761194%;
}
#product .title {
  max-height: 2.66668em;
  margin-bottom: 0.66666667em;
}
#product .tag {
  overflow: hidden;
}
#product .tag span {
  display: block;
  border: 0.02rem solid #fff;
  height: 2.77777778em;
  border-radius: 1.38888889em;
  min-width: 7.77777778em;
  padding: 0 1.125em;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0.83333333em;
  margin-right: 0.83333333em;
}
#product .tag span:last-child {
  margin-right: 0;
}
#product .info {
  display: block;
  overflow: hidden;
  position: relative;
}
#product .swiper-slide-active .figure:after {
  --opacity: 0;
}
#product .btm {
  margin-top: 0.6rem;
}
#product .bar {
  padding: 0 0.55rem;
  max-width: calc(100% - 1.4rem);
}
#product .total {
  color: #2a2a2a;
}
@media only screen and (max-width: 1024px) {
  #product .text {
    font-size: 0.16rem;
  }
  #product .title {
    font-size: 0.26rem;
  }
}
@media only screen and (max-width: 750px) {
  #product {
    padding: 0.3rem 0;
  }
  #product .swiper {
    width: 100%;
    max-width: none;
  }
  #product .text {
    font-size: 0.14rem;
  }
  #product .btm {
    margin-top: 0.35rem;
  }
  #product .bar {
    padding: 0 0.35rem;
  }
}
/*home-box*/
.home-box {
  background: #fff url(../images/about_bg.jpg) no-repeat center top;
  background-size: 100% auto;
  padding: 0.8rem 0;
}
@media only screen and (max-width: 750px) {
  .home-box {
    padding: 0.3rem 0;
  }
}
/*about*/
#about {
  padding: 0.7rem 0;
  position: relative;
  margin-bottom: 0.1rem;
}
#about .top {
  margin-bottom: 6.25%;
}
#about .intro {
  width: 46.875%;
}
#about .module-name {
  margin-bottom: 12.26666667%;
}
#about .entry {
  color: rgba(0, 0, 0, 0.85);
}
#about .data {
  width: 6.1rem;
}
#about .data .info {
  position: relative;
  height: 100%;
  width: 86.8852459%;
}
#about .data .num {
  font-size: 0.6rem;
  line-height: 1em;
  letter-spacing: -0.01666667em;
  margin-bottom: 0.08333333em;
}
#about .data sub {
  font-size: 0.5em;
  line-height: 1.5em;
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.5em;
}
#about .data li {
  width: 50%;
  position: relative;
  line-height: 1.5em;
  color: rgba(0, 0, 0, 0.85);
  padding: 0.15rem 0;
}
#about .data li:before,
#about .data li:after {
  content: '';
  display: block;
  position: absolute;
  background-color: #eaeaea;
  opacity: 0;
}
#about .data li:before {
  height: 0.01rem;
  width: 85.48387097%;
  bottom: 100%;
  left: auto;
}
#about .data li:after {
  width: 0.01rem;
  height: 1.28rem;
  bottom: 0;
  right: 0;
}
#about .data li:nth-child(2n) .info {
  max-width: 2.15rem;
}
#about .data li:nth-child(2n+1) {
  justify-content: flex-start;
}
#about .data li:nth-child(2n+1):after {
  opacity: 1;
}
#about .data li:nth-child(n+3) {
  margin-top: 5.90163934%;
  padding-top: 5.90163934%;
}
#about .data li:nth-child(n+3):before {
  opacity: 1;
}
#about .btm {
  overflow: hidden;
}
#about .list {
  width: 62.5%;
}
#about .list .box {
  width: 116%;
}
#about .list .item {
  padding-right: 0.01rem;
  width: 50%;
}
#about .list .item:last-child {
  padding-right: 0;
}
#about .list .figure {
  padding-bottom: 50%;
}
#about .list a {
  display: block;
  overflow: hidden;
  position: relative;
}
#about .btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 100%;
  padding: 0 5%;
  cursor: pointer;
}
#about .btn .play {
  width: 1.02rem;
  background: url(../images/play_01.svg) no-repeat center center;
  background-size: contain;
  margin: 0 0.3rem;
}
#about .btn .play:after {
  display: block;
  content: '';
  padding-bottom: 100%;
}
#about .btn p {
  padding: 0.03rem 0;
}
#about .btn .name {
  font-size: 1.25em;
  line-height: 1.3334em;
}
#about .video {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
  display: none;
}
#about .video .box {
  position: relative;
  padding-bottom: 50%;
}
#about .video video {
  display: block;
  object-fit: cover;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 1280px) {
  #about .list .box {
    width: 105.33333333%;
  }
}
@media only screen and (max-width: 1024px) {
  #about .data {
    width: 45%;
    font-size: 0.18rem;
  }
  #about .data .num {
    font-size: 0.4rem;
  }
  #about .list .box {
    width: 105.33333333%;
  }
  #about .btn .play {
    width: 0.8rem;
    margin: 0 0.2rem;
  }
  #about .btn .meta {
    font-size: 0.14rem;
  }
}
@media only screen and (max-width: 750px) {
  #about {
    padding: 0.3rem 0;
  }
  #about .module-name {
    margin-bottom: 0.35rem;
  }
  #about .intro {
    width: 100%;
    margin-bottom: 0.4rem;
  }
  #about .data {
    width: 100%;
  }
  #about .list {
    width: 100%;
  }
  #about .list .box {
    width: auto;
  }
  #about .list .item {
    width: 100%;
    margin-bottom: 0.01rem;
    padding-right: 0;
  }
  #about .button-more {
    margin-bottom: 0.35rem;
  }
  #about .video {
    position: fixed;
    left: 0;
    top: 0;
    transform: none;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    z-index: 8;
  }
  #about .video .wrap {
    position: absolute;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
    padding: 0 3.125%;
  }
}
/*news-post*/
#news-post {
  padding: 0.2rem 0;
}
#news-post .title {
  --opacity: 0.1;
  border-bottom: 0.01rem solid rgba(0, 0, 0, var(--opacity));
  padding-right: 21.25%;
  padding-bottom: 0.83333333em;
  margin-bottom: 0.88888889em;
}
#news-post .meta {
  --opacity: 0.8;
  color: rgba(0, 0, 0, var(--opacity));
  margin-bottom: 0.55rem;
}
#news-post .meta span {
  display: block;
  background: no-repeat left center;
  background-size: 1.05555556em auto;
  padding-left: 1.77777778em;
  margin-right: 0.3rem;
}
#news-post .meta span:last-child {
  margin-right: 0;
}
#news-post .meta .date {
  background-image: url(../images/date_01.svg);
}
#news-post .entry {
  width: 11.4rem;
  max-width: 78.75%;
}
#news-post .entry h3 {
  font-size: 1.11111111em;
}
#news-post .other {
  position: sticky;
  top: 1.8rem;
}
#news-post .other .arrow {
  margin-bottom: 0.88888889em;
}
#news-post .other i {
  display: block;
  overflow: hidden;
  border-radius: 50%;
  border: 0.01rem solid #222;
  position: absolute;
  left: 0;
  top: 0;
  width: 2.44444444em;
}
#news-post .other i:before {
  display: block;
  content: '';
  padding-bottom: 100%;
}
#news-post .other i:after {
  width: 38.0952381%;
  padding-bottom: 30.95238095%;
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: no-repeat center center;
  background-size: contain;
}
#news-post .other a {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #010101;
  padding-left: 3.16666667em;
  line-height: 2.44444444em;
  position: relative;
}
#news-post .other a:hover i {
  border-color: transparent;
  background-color: var(--main-color);
}
#news-post .other a:hover i:after {
  filter: invert(1);
}
#news-post .other .prev i:after {
  background-image: url(../images/arrow_prev_01.svg);
}
#news-post .other .next i:after {
  background-image: url(../images/arrow_next_01.svg);
}
#news-post .other .back i:after {
  background-image: url(../images/back_01.png);
  width: 45.45454545%;
  padding-bottom: 31.81818182%;
}
@media only screen and (max-width: 750px) {
  #news-post .title {
    padding-right: 0;
    font-size: 0.26rem;
  }
  #news-post .meta {
    margin-bottom: 0.3rem;
  }
  #news-post .entry {
    width: 100%;
    max-width: none;
    margin-bottom: 0.3rem;
  }
  #news-post .other {
    width: 100%;
    display: flex;
    justify-content: space-between;
    font-size: 0.16rem;
  }
  #news-post .other .arrow {
    margin-bottom: 0;
  }
}
/*banner*/
#banner {
  padding-bottom: 36.45833333%;
  background: no-repeat center center;
  background-size: cover;
  position: relative;
  overflow: hidden;
}
#banner .text {
  position: absolute;
  bottom: 10.85714286%;
  left: 0;
  width: 100%;
  z-index: 5;
}
#banner .name {
  font-size: 0.6rem;
  line-height: 1.35em;
}
@media only screen and (max-width: 750px) {
  #banner {
    padding-bottom: 75%;
  }
  #banner .name {
    font-size: 0.4rem;
  }
}
/*inbar*/
#inbar {
  position: relative;
}
#inbar:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0.01rem;
  background-color: #ccc;
}
#inbar .inner {
  position: relative;
}
/*submenu*/
.submenu {
  position: relative;
  line-height: 1.5em;
  padding-right: 0.65rem;
}
.submenu .swiper-slide {
  width: auto;
  padding: 0.25rem 0;
}
.submenu .swiper-slide:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  height: 0.03rem;
  width: 100%;
  background-color: var(--main-color);
  opacity: 0;
}
.submenu a {
  display: block;
  white-space: nowrap;
}
.submenu .cur:after {
  opacity: 1;
}
.submenu .cur a {
  color: var(--main-color);
  font-weight: bold;
}
.submenu .arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 0.15rem;
  height: 0.13rem;
  background: no-repeat center center;
  background-size: contain;
  cursor: pointer;
}
.submenu .arrow:not(:hover) {
  filter: brightness(0);
}
.submenu .prev {
  right: 0.3rem;
  background-image: url(../images/submenu_prev.svg);
}
.submenu .next {
  right: 0;
  background-image: url(../images/submenu_next.svg);
}
@media only screen and (max-width: 750px) {
  .submenu .swiper-slide {
    padding: 0.2rem 0;
  }
}
/*wrapper*/
#wrapper {
  padding: 1rem 0 1.2rem;
  overflow: hidden;
}
@media only screen and (max-width: 750px) {
  #wrapper {
    padding: 0.6rem 0 0.7rem;
  }
}
/*pagenavi*/
#pagenavi {
  width: 100%;
}
/*Pages*/
.Pages {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.Pages .p_jump,
.Pages .p_cur,
.Pages .p_count,
.Pages .p_total,
.Pages .a_first,
.Pages .a_end {
  display: none;
}
.Pages .p_page {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.Pages .num {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-style: normal;
}
.Pages a {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0.55555556em;
  min-width: 3.33333333em;
  border-radius: 1.66666667em;
  height: 3.33333333em;
  padding: 0 0.5em;
  position: relative;
  transition: all 0.3s;
  --opacity: 0.1;
  border: 0.01rem solid rgba(0, 0, 0, var(--opacity));
  color: #08233f;
  overflow: hidden;
}
.Pages a:after {
  width: 34.48275862%;
  padding-bottom: 29.31034483%;
  background: no-repeat center center;
  background-size: contain;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  content: '';
  display: block;
}
.Pages a:hover,
.Pages .a_cur {
  color: #fff;
  background-color: var(--main-color);
  border-color: transparent;
}
.Pages .a_prev,
.Pages .a_next {
  text-indent: -99999em;
  background-color: rgba(var(--r), var(--g), var(--b), var(--opacity));
  border-color: transparent;
}
.Pages .a_prev:hover,
.Pages .a_next:hover {
  --opacity: 0.1;
}
.Pages .a_prev:hover:after,
.Pages .a_next:hover:after {
  filter: brightness(100);
}
.Pages .a_prev:after {
  background-image: url(../images/page_prev.svg);
}
.Pages .a_next:after {
  background-image: url(../images/page_next.svg);
}
@media only screen and (max-width: 750px) {
  .Pages {
    font-size: 0.16rem;
  }
  .Pages a {
    min-width: 3em;
    height: 3em;
    line-height: 3em;
    border-radius: 1.5em;
    margin: 0.35em;
  }
}
/*news-list*/
#news-list {
  --opacity: 0.1;
  border-top: 0.01rem solid rgba(0, 0, 0, var(--opacity));
  margin-bottom: 0.6rem;
}
@media only screen and (max-width: 750px) {
  #news-list {
    margin-bottom: 0.4rem;
  }
}
/*photos-list*/
.photos-list {
  overflow: hidden;
  margin-bottom: 0.6rem;
}
.photos-list:last-child {
  margin-bottom: 0;
}
.photos-list .name {
  margin-bottom: 0.35rem;
}
.photos-list .list {
  --margin: 0.12rem;
}
.photos-list .figure {
  padding-bottom: 66.66666667%;
}
.photos-list .figure:after {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  opacity: 0;
  transition: all 0.3s;
}
.photos-list .zoom {
  display: block;
  overflow: hidden;
  position: relative;
}
.photos-list .zoom:after {
  width: 0.24rem;
  height: 0.24rem;
  background: url(../images/zoom_01.png) no-repeat right center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  top: 0.13rem;
  right: 0.13rem;
  z-index: 3;
  opacity: 0;
  transition: all 0.3s;
}
.photos-list .zoom:hover:after,
.photos-list .zoom:hover .figure:after {
  opacity: 1;
}
@media only screen and (max-width: 1024px) {
  .photos-list .item {
    width: 33.333%;
  }
}
@media only screen and (max-width: 750px) {
  .photos-list {
    margin-bottom: 0.4rem;
  }
  .photos-list .name {
    margin-bottom: 0.25rem;
  }
  .photos-list .item {
    width: 50%;
  }
}
/*popup*/
.popup {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 10;
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden;
  display: none;
}
.popup .wrap {
  width: 100%;
  min-height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
}
.popup .box {
  position: relative;
  padding: 0.7rem 0.9rem 0;
  max-width: 100%;
}
.popup .close {
  width: 0.6rem;
  border-radius: 50%;
  background-color: #fff;
  position: absolute;
  right: 0.1rem;
  top: 0.1rem;
  cursor: pointer;
}
.popup .close:before {
  display: block;
  content: '';
  padding-bottom: 100%;
}
.popup .close:after {
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 25%;
  padding-bottom: 26.66666667%;
  background: url(../images/close_01.svg) no-repeat center center;
  background-size: contain;
}
@media only screen and (max-width: 1024px) {
  .popup .box {
    padding: 0.6rem 0.8rem 0;
  }
  .popup .close {
    width: 0.5rem;
  }
}
@media only screen and (max-width: 750px) {
  .popup .box {
    padding: 0.45rem 0.55rem 0;
  }
  .popup .close {
    width: 0.35rem;
  }
}
/*photo-popup*/
.photo-popup .info {
  width: 12rem;
  max-width: 100%;
}
.photo-popup .figure {
  padding-bottom: 66.66666667%;
}
.photo-popup .arrow {
  filter: invert(1) brightness(100);
  --opacity: 0.5;
}
.photo-popup .arrow:hover {
  filter: invert(0);
  --opacity: 1;
}
.photo-popup .prev {
  left: -0.44rem;
}
.photo-popup .next {
  right: -0.44rem;
}
@media only screen and (max-width: 1024px) {
  .photo-popup .prev {
    left: 0.12rem;
  }
  .photo-popup .next {
    right: 0.12rem;
  }
}
/*notice-item*/
.notice-item {
  border-bottom: 0.01rem solid rgba(0, 0, 0, var(--opacity));
  padding: 0.35rem 0;
}
.notice-item .date {
  --opacity: 0.8;
  color: rgba(0, 0, 0, var(--opacity));
}
.notice-item .date time {
  background: url(../images/date_01.svg) no-repeat left center;
  background-size: 1.05555556em auto;
  padding-left: 1.77777778em;
}
.notice-item .title {
  width: calc(100% - 2.25rem);
  padding: 0 7.5% 0 0.4rem;
  line-height: 1.33333333em;
  height: 2.58333333em;
  position: relative;
}
.notice-item .title:before {
  width: 0.01rem;
  background-color: #e7e7e7;
  height: 2.125em;
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
@media only screen and (max-width: 750px) {
  .notice-item .date {
    width: 100%;
    margin-bottom: 0.15rem;
  }
  .notice-item .title {
    width: 100%;
    height: auto;
    max-height: 2.58333333em;
    padding: 0;
  }
  .notice-item .title:before {
    display: none;
  }
}
/*contact*/
#contact .name {
  font-size: 0.52rem;
  line-height: 1.3335em;
}
#contact .info {
  width: 37.8125%;
}
#contact .info .name {
  margin-bottom: 0.96153846em;
}
#contact .info .item {
  border-bottom: 0.01rem solid #ddd;
  padding-bottom: 0.35rem;
  margin-bottom: 0.4rem;
}
#contact .info .item:last-child {
  margin-bottom: 0;
}
#contact .info .title {
  padding-left: 2.22222222em;
  background: no-repeat left center;
  background-size: 1.27777778em auto;
  margin-bottom: 1em;
}
#contact .info .tel {
  background-image: url(../images/contact_tel.png);
}
#contact .info .fax {
  background-image: url(../images/contact_fax.png);
}
#contact .info .add {
  background-image: url(../images/contact_add.png);
}
#contact .info .intro {
  margin-left: 2em;
}
#contact .form {
  width: 57.875%;
  border-left: 0.01rem solid #ddd;
  padding-left: 4.375%;
  padding-bottom: 4.8125%;
}
#contact .form .tips {
  margin-bottom: 5.8685446%;
}
#contact .form .name {
  margin-bottom: 0.42307692em;
}
#contact .form .item {
  border-bottom: 0.01rem solid #ddd;
  margin-bottom: 2.9342723%;
}
#contact .form .input {
  position: relative;
}
#contact .form .label {
  color: #999;
  position: absolute;
  left: 0;
  top: 0;
  height: 3.875em;
  line-height: 3.875em;
  display: none;
}
#contact .form .text {
  display: block;
  width: 100%;
  height: 3.875em;
  line-height: 1.875em;
  padding: 1em 0;
  position: relative;
  z-index: 5;
}
#contact .form textarea.text {
  height: 7.125em;
}
#contact .form .col2 .item {
  width: 48.35680751%;
}
#contact .form .button {
  margin-top: 0.35rem;
}
#contact .form .submit {
  color: #fff;
  background-color: var(--main-color);
  width: 11.8125em;
  height: 3.3125em;
  cursor: pointer;
}
@media only screen and (max-width: 750px) {
  #contact .name {
    font-size: 0.4rem;
  }
  #contact .info {
    width: 100%;
    margin-bottom: 0.5rem;
  }
  #contact .form {
    width: 100%;
    padding: 0;
    border-left: none;
  }
  #contact .form .col2 .item {
    width: 100%;
  }
}
/*columnname*/
.columnname {
  font-size: 0.56rem;
  line-height: 1.35em;
}
@media only screen and (max-width: 750px) {
  .columnname {
    font-size: 0.36rem;
  }
}
.columnintro h3 {
  font-size: 0.22rem;
  line-height: 1.36363636em;
}
/*columninfo*/
.columninfo {
  margin-bottom: 6.25%;
}
.columninfo .columnintro {
  margin-top: 0.32rem;
}
@media only screen and (max-width: 750px) {
  .columninfo .columnintro {
    margin-top: 0.2rem;
  }
}
/*textpic*/
.textpic {
  margin-bottom: 5%;
}
.textpic .text {
  width: 48.75%;
}
.textpic .title {
  margin-bottom: 0.3rem;
}
.textpic .pic {
  width: 48.75%;
}
.textpic .figure {
  padding-bottom: 66.66666667%;
}
.textpic:nth-child(2n) {
  flex-direction: row-reverse;
}
@media only screen and (max-width: 750px) {
  .textpic {
    margin-bottom: 0.5rem;
  }
  .textpic .text {
    width: 100%;
    margin-bottom: 0.32rem;
  }
  .textpic .title {
    margin-bottom: 0.25rem;
  }
  .textpic .pic {
    width: 100%;
  }
}
/*product-item*/
.product-item {
  width: 48.75%;
  margin-bottom: 3.4375%;
}
.product-item .figure {
  padding-bottom: 66.66666667%;
  margin-bottom: 0.2rem;
}
.product-item .title {
  margin-bottom: 0.3125em;
  letter-spacing: -0.03125em;
}
.product-item .intro {
  --opacity: 0.85;
  color: rgba(0, 0, 0, var(--opacity));
}
@media only screen and (max-width: 750px) {
  .product-item {
    width: 100%;
    margin-bottom: 0.5rem;
  }
  .product-item .title {
    font-size: 0.28rem;
  }
}
/*health*/
#health .columnintro,
#health .entry {
  --opacity: 0.85;
  color: rgba(0, 0, 0, var(--opacity));
}
#health .columninfo {
  margin-bottom: 0.55rem;
}
#health .textpic {
  border-top: 0.01rem solid rgba(0, 0, 0, 0.1);
  padding: 0.6rem 0;
  margin-bottom: 0;
}
@media only screen and (max-width: 750px) {
  #health .textpic {
    padding: 0.5rem 0;
  }
  #health .textpic .text {
    margin: 0.32rem 0 0;
  }
}
/*categories*/
.categories {
  margin-bottom: 0.2rem;
}
.categories ul {
  overflow: hidden;
}
.categories li {
  margin-right: 1em;
  margin-bottom: 1em;
}
.categories li:last-child {
  margin-right: 0;
}
.categories a {
  display: block;
  background-color: #f5f5f5;
  height: 3em;
  line-height: 3em;
  border-radius: 1.5em;
  padding: 0 1.5em;
  color: #666;
}
.categories a:hover,
.categories .active a {
  background-color: var(--main-color);
  color: #fff;
}
@media only screen and (max-width: 750px) {
  .categories {
    font-size: 0.16rem;
  }
  .categories ul {
    justify-content: space-between;
  }
  .categories li {
    width: 49%;
    margin-right: 0;
    margin-bottom: 2%;
    text-align: center;
  }
}
/*operation*/
#operation {
  border-top: 0.01rem solid rgba(0, 0, 0, 0.1);
  margin-bottom: 0.6rem;
}
#operation .date {
  width: 2.2rem;
}
#operation .title {
  width: calc(100% - 3.4rem);
  line-height: 1.5em;
}
#operation .view {
  position: relative;
  padding-right: 2.11111111em;
}
#operation .view i {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1.55555556em;
  height: 1.55555556em;
  border: solid 0.01rem #666666;
  border-radius: 50%;
  display: block;
}
#operation .view i:after {
  width: 26.92307692%;
  padding-bottom: 46.15384615%;
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: url(../images/circle_more.svg) no-repeat center center;
  background-size: contain;
  filter: invert(1);
  opacity: 0.6;
}
#operation .info {
  padding: 1.38888889em 1.11111111em;
}
#operation .info:hover i {
  background-color: var(--main-color);
  border-color: transparent;
}
#operation .info:hover i:after {
  opacity: 1;
  filter: invert(0);
}
#operation .item:nth-child(2n) {
  background-color: #fafafa;
}
@media only screen and (max-width: 750px) {
  #operation {
    margin-bottom: 0.4rem;
  }
  #operation .date,
  #operation .title {
    width: 100%;
    margin-bottom: 0.1rem;
  }
  #operation .view {
    width: 100%;
  }
}
/*text-list*/
#text-list {
  border-top: 0.01rem solid rgba(0, 0, 0, 0.1);
  margin-bottom: 0.6rem;
}
/*text-item*/
.text-item:nth-child(2n) {
  background-color: #fafafa;
}
.text-item .title {
  width: calc(100% - 2rem);
  max-width: 11.6rem;
  font-size: 1em;
}
.text-item a {
  position: relative;
  line-height: 1.5em;
  padding: 1em;
}
@media only screen and (max-width: 750px) {
  .text-item .title {
    width: 100%;
    max-width: none;
    margin-bottom: 0.1rem;
  }
  .text-item .date {
    width: 100%;
  }
}
/*box-name*/
.box-name {
  font-size: 0.52rem;
  line-height: 1.35em;
  margin: 0 0 1.15384615em;
}
@media only screen and (max-width: 750px) {
  .box-name {
    font-size: 0.4rem;
  }
}
/*module-box*/
.module-box {
  padding: 1.2rem 0;
  overflow: hidden;
  background: no-repeat center center;
  background-size: cover;
}
@media only screen and (max-width: 750px) {
  .module-box {
    padding: 0.6rem 0;
  }
}
/*report*/
#report .list {
  border-top: 0.01rem solid rgba(0, 0, 0, 0.1);
}
#report .date {
  width: 12.5em;
}
#report .title {
  font-size: 1em;
  width: calc(100% - 12.5em);
  padding-right: 9.61538462%;
}
#report .info {
  padding: 1.25em 1em;
  position: relative;
}
#report .info:after {
  width: 0.85em;
  height: 0.9em;
  background: url(../images/download_01.svg) no-repeat center center;
  background-size: contain;
  content: '';
  display: block;
  position: absolute;
  right: 2.875%;
  top: 50%;
  transform: translateY(-50%);
}
#report .item:nth-child(2n) {
  background-color: #fafafa;
}
@media only screen and (max-width: 750px) {
  #report .date {
    width: 100%;
    margin-bottom: 0.1rem;
  }
  #report .title {
    width: 100%;
  }
}
/*charity*/
#charity {
  min-height: 8rem;
}
#charity .box-name {
  margin-bottom: 0.57692308em;
}
#charity .intro {
  max-width: 11.2rem;
  margin: 0 auto;
  --opacity: 0.85;
  color: rgba(255, 255, 255, var(--opacity));
}
@media only screen and (max-width: 750px) {
  #charity {
    min-height: 5rem;
  }
}
/*culture*/
#culture .figure {
  width: 48.75%;
}
#culture .figure:after {
  padding-bottom: 66.66666667%;
  display: block;
}
#culture .text {
  width: 46.5625%;
}
#culture .box-name {
  margin-bottom: 0.48076923em;
}
#culture .item {
  border-bottom: 0.01rem solid rgba(0, 0, 0, 0.1);
  padding: 0.27rem 0;
}
#culture .title {
  letter-spacing: -0.03125em;
  position: relative;
  cursor: pointer;
}
#culture .title:after {
  width: 1.25em;
  height: 1.25em;
  background-color: var(--main-color);
  content: '+';
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-weight: 300;
  color: #fff;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
#culture .intro {
  --opacity: 0.85;
  color: rgba(0, 0, 0, var(--opacity));
  padding: 0.18rem 0 0.2rem;
  display: none;
}
#culture .active .title:after {
  content: '-';
}
@media only screen and (max-width: 750px) {
  #culture .figure {
    width: 100%;
    margin-bottom: 0.35rem;
  }
  #culture .text {
    width: 100%;
  }
  #culture .box-name {
    margin-bottom: 0.2rem;
  }
}
/*view-more*/
.view-more {
  font-size: 0.32rem;
}
.view-more:after {
  width: 1.25em;
  height: 1.25em;
  background-color: var(--main-color);
  content: '+';
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-weight: 300;
  color: #fff;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
/*job-list*/
#job-list {
  margin: 0.55rem 0;
}
/*job-item*/
.job-item {
  padding: 0 0.4rem;
}
.job-item .top {
  position: relative;
  padding: 0.4rem 0.5rem 0.4rem 0;
  cursor: pointer;
}
.job-item .top:after {
  content: '';
  display: block;
  position: absolute;
  width: calc(100% + 0.8rem);
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  background-color: #f1f2f3;
  height: 0.01rem;
  transition: all 0.3s;
}
.job-item .title {
  line-height: 1.25em;
  padding: 0.05rem 0;
  margin-right: 0.5rem;
}
.job-item .meta {
  line-height: 1.5em;
}
.job-item .meta span {
  margin-right: 0.5rem;
  padding: 0.05rem 0;
}
.job-item .view-more {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.job-item .btm {
  padding: 0.32rem 0 0.65rem;
  display: none;
}
.job-item .entry h4 {
  font-size: 0.2rem;
  line-height: 1.5em;
  color: #000;
}
.job-item .button-more {
  margin-top: 0.32rem;
}
.job-item .go {
  width: 13.33333333em;
}
.job-item.active {
  background-color: #f5f5f5;
}
.job-item.active .top:after {
  width: 100%;
  background-color: rgba(0, 0, 0, 0.2);
}
.job-item.active .view-more:after {
  content: '-';
}
@media only screen and (max-width: 750px) {
  .job-item {
    padding: 0 0.2rem;
  }
  .job-item .top {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
  }
  .job-item .top:after {
    width: calc(100% + 0.4rem);
  }
  .job-item .title {
    width: 100%;
    margin-right: 0;
  }
  .job-item .meta span {
    width: 100%;
    margin-right: 0;
  }
  .job-item .btm {
    padding: 0.35rem 0;
  }
}
/*job-popup*/
.job-popup .box {
  width: 8.4rem;
  padding: 0.45rem 0.6rem 0.7rem;
  background-color: #faf4f0;
  border-radius: 0.1rem;
  max-width: 90%;
}
.job-popup .close {
  background-color: transparent;
  width: 0.17rem;
  right: 0.2rem;
  top: 0.2rem;
}
.job-popup .close:after {
  width: 100%;
  height: 100%;
  opacity: 0.8;
}
.job-popup .title {
  font-size: 0.44rem;
  line-height: 1.25em;
  color: #181818;
  margin-bottom: 0.07rem;
}
.job-popup .tips {
  line-height: 1.44444444em;
}
.job-popup .form {
  margin-top: 0.2rem;
}
.job-popup .item {
  margin-bottom: 2.08333333%;
}
.job-popup .input {
  background-color: #ffffff;
  border-radius: 0.05rem;
  overflow: hidden;
  position: relative;
}
.job-popup .label {
  color: #666;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  padding: 0 1.25em;
  height: 3.25em;
  line-height: 3.25em;
}
.job-popup .text {
  display: block;
  width: 100%;
  padding: 0.6875em 1.25em;
  height: 3.25em;
  line-height: 1.875em;
  position: relative;
  z-index: 2;
}
.job-popup .file {
  min-height: 1.2rem;
  line-height: 1.625em;
  padding: 0.3rem;
  text-align: center;
}
.job-popup .view {
  width: 1.66666667em;
  height: 1.11111111em;
  background-color: #faf4f0;
  border-radius: 0.05rem;
  margin-bottom: 0.04rem;
  cursor: pointer;
}
.job-popup .view:after {
  content: '+';
  display: block;
}
.job-popup #file {
  display: none;
}
.job-popup .selected:after {
  content: '✓';
}
.job-popup .button {
  margin-top: 2.08333333%;
}
.job-popup .submit {
  font-size: 0.2rem;
  color: #fff;
  width: 10em;
  max-width: 100%;
  height: 3em;
  border-radius: 1.5em;
  background-color: var(--main-color);
}
.job-popup .col2 .item {
  width: 48.61111111%;
}
@media only screen and (max-width: 750px) {
  .job-popup .box {
    padding: 0.25rem 0.3rem 0.3rem;
  }
  .job-popup .title {
    font-size: 0.32rem;
  }
  .job-popup .col2 .item {
    width: 100%;
  }
}
/*culture-list*/
.culture-list {
  margin-bottom: 0.2rem;
}
.culture-list .list {
  --margin: 0.4rem;
  margin-top: 0.45rem;
}
.culture-list .figure {
  padding-bottom: 66.66666667%;
  margin-bottom: 0.2rem;
}
.culture-list .title {
  letter-spacing: -0.03125em;
  margin-bottom: 0.12rem;
}
.culture-list .intro {
  color: rgba(0, 0, 0, 0.85);
}
@media only screen and (max-width: 750px) {
  .culture-list .list {
    margin-top: 0.35rem;
  }
}
/*culture-values*/
.culture-values {
  margin-bottom: 0.9rem;
}
.culture-values .list {
  margin-top: 0.3rem;
  background: no-repeat center center;
  background-size: cover;
  position: relative;
}
.culture-values .list:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
}
.culture-values .item {
  flex-grow: 1;
  width: 15.625%;
  border-right: 0.01rem solid rgba(255, 255, 255, 0.2);
  padding: 6.875% 2.5%;
  position: relative;
  z-index: 5;
  height: 6.4rem;
}
.culture-values .item:last-child {
  border-right: none;
}
.culture-values .title {
  transition: inherit;
}
.culture-values .entry {
  color: rgba(255, 255, 255, 0.85);
  width: 4.8rem;
  margin-top: 0.25rem;
  transition: inherit;
}
.culture-values .active .title {
  font-weight: bold;
  font-size: 0.24rem;
}
@media only screen and (min-width: 751px) {
  .culture-values .entry {
    opacity: 0;
    transform: translateY(0.2rem);
  }
  .culture-values .active {
    width: 37.5%;
  }
  .culture-values .active .entry {
    opacity: 1;
    transform: translateY(0);
  }
}
@media only screen and (max-width: 1024px) {
  .culture-values .entry {
    width: 3.4rem;
  }
}
@media only screen and (max-width: 750px) {
  .culture-values {
    margin-bottom: 0.5rem;
  }
  .culture-values .list {
    flex-direction: column;
  }
  .culture-values .item {
    width: 100%;
    border-right: none;
    height: auto;
    padding: 0.35rem;
  }
  .culture-values .item:nth-child(n+1) {
    border-top: 0.01rem solid rgba(255, 255, 255, 0.2);
  }
  .culture-values .entry {
    width: auto;
    display: none;
  }
  .culture-values .active .entry {
    display: block;
  }
}
/*culture-conduct*/
.culture-conduct .list {
  --margin: 0.14rem;
  margin-top: 0.5rem;
}
.culture-conduct .info {
  background-color: var(--main-color);
  position: relative;
  height: 100%;
  padding: 0.32rem 0.4rem 0.34rem;
}
.culture-conduct .title {
  margin-bottom: 0.2rem;
}
@media only screen and (max-width: 750px) {
  .culture-conduct .list {
    margin-top: 0.3rem;
  }
}
/*about_profile*/
.about_profile {
  margin-bottom: 1rem;
}
.about_profile .columnname {
  margin-bottom: 0.67857143em;
}
.about_profile .media {
  width: 50%;
  position: relative;
  cursor: pointer;
}
.about_profile .meta {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 0.17rem 0.3rem;
  line-height: 1.5625em;
}
.about_profile .play {
  width: 1.5625em;
  height: 1.5625em;
  background: url(../images/play_02.svg) no-repeat center center;
  background-size: contain;
}
.about_profile .figure {
  padding-bottom: 56.25%;
}
.about_profile .text {
  width: 47.5%;
}
.about_profile .intro {
  color: rgba(0, 0, 0, 0.85);
}
@media only screen and (max-width: 750px) {
  .about_profile {
    margin-bottom: 0.5rem;
  }
  .about_profile .media {
    width: 100%;
  }
  .about_profile .text {
    width: 100%;
    margin-bottom: 0.35rem;
  }
}
/*vpopup*/
.vpopup video {
  display: block;
  width: auto;
  max-width: 90vw;
  height: auto;
  max-height: 90vh;
  object-fit: contain;
}
/*about-data*/
.about-data {
  line-height: 1.5em;
  color: rgba(0, 0, 0, 0.85);
  margin-bottom: 0.7rem;
}
.about-data li {
  justify-content: center;
  position: relative;
}
.about-data li:after {
  width: 0.01rem;
  height: 1rem;
  background-color: #eaeaea;
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.about-data li:nth-child(1) {
  width: 21.875%;
  justify-content: flex-start;
}
.about-data li:nth-child(2) {
  width: 28.125%;
}
.about-data li:nth-child(2) .info {
  max-width: 11em;
}
.about-data li:nth-child(3) {
  width: 30.625%;
}
.about-data li:nth-child(3) .info {
  max-width: 14em;
}
.about-data li:nth-child(4) {
  width: 19.375%;
  justify-content: flex-end;
}
.about-data li:nth-child(4) .info {
  max-width: 9.5em;
}
.about-data .num {
  font-size: 3em;
  line-height: 0.8em;
  margin-bottom: 0.12rem;
}
.about-data .num sub {
  font-size: 0.5em;
  line-height: 1em;
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.5em;
}
@media only screen and (max-width: 1024px) {
  .about-data {
    font-size: 0.18rem;
  }
}
@media only screen and (max-width: 750px) {
  .about-data {
    font-size: 0.16rem;
    margin-bottom: 0.5rem;
  }
  .about-data li {
    padding: 0.15rem 0;
  }
  .about-data li:nth-child(n+1) {
    width: 50%;
    justify-content: flex-start;
  }
  .about-data li:nth-child(n+1) .info {
    max-width: 12em;
  }
  .about-data li:nth-child(2n) {
    justify-content: flex-end;
  }
  .about-data li:nth-child(2n):after {
    display: none;
  }
  .about-data .num {
    font-size: 2.6em;
  }
}
/*about-intro*/
.about-intro {
  color: rgba(0, 0, 0, 0.85);
  margin-bottom: 0.75rem;
}
@media only screen and (max-width: 750px) {
  .about-intro {
    margin-bottom: 0.5rem;
  }
}
/*about-video*/
.about-video {
  position: relative;
}
.about-video .figure {
  padding-bottom: 56.25%;
}
.about-video .btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 100%;
  padding: 0 5%;
  cursor: pointer;
}
.about-video .btn .play {
  width: 1rem;
  background: url(../images/play_01.svg) no-repeat center center;
  background-size: contain;
  margin-right: 0.3rem;
}
.about-video .btn .play:after {
  display: block;
  content: '';
  padding-bottom: 100%;
}
.about-video .btn p {
  padding: 0.03rem 0;
}
.about-video .btn .name {
  font-size: 1.25em;
  line-height: 1.3334em;
}
.about-video:hover .play {
  transform: scale(0.8);
}
@media only screen and (max-width: 750px) {
  .about-video .btn .play {
    width: 0.6rem;
  }
}