@charset "UTF-8";

@font-face {
  font-family: 'HanYiZhongYuanJian';
  src: url("../fonts/hanyizhongyuanjian-1.ttf");
}

@font-face {
  font-family: 'Krub-Bold';
  src: url("../fonts/krub-bold.ttf");
}

.font-12 {
  font-size: 12px;
}

.font-14,
.footer .left-box p,
.footer .form .s-box i,
.footer .form .s-box a,
.cookie p,
.c-crumbs a,
.investor-s2 .box span,
.investor-s2 .box .tip,
.media-s7 .item .top-box span,
.portfolio-s2 .table .box .cate span {
  font-size: 14px;
}

.font-16,
.fixed-search input,
.fixed-search .link a,
.cookie a,
.c-subnav a,
.comm-page li a,
.text-modal .para,
.search-s1 .form input,
.search-s1 .link a,
.search-s1 .item span,
.search-s1 .item p,
.about-s2 .item .tip,
.about-s7 .pagination span,
.about-s10 .r-box span,
.responsibility-s5 .box .info-txt p,
.responsibility-s7 .item p,
.responsibility-s8 .info-txt p,
.responsibility-s9 .item .para,
.responsibility-s12 .item p,
.responsibility-s15 .item .btns a,
.career-s2 .filter .year-box span,
.career-s2 .filter .year-box .hide a,
.career-s2 .filter .form input,
.career-s3 .item p,
.career-s4 .item p,
.career-s5 .item .info span,
.career-s5 .item p,
.career-s5 .item a,
.career-s6 .info span,
.career-s7 .item .para,
.career-s8 .item .para,
.investor-s3 .item p,
.investor-s6 .item .s-date,
.investor-s6 .item p,
.media-s1 .filter .form input,
.media-s1 .filter .year-box span,
.media-s1 .filter .year-box .hide a,
.media-s1 .item .date,
.media-s1 .item p,
.media-s2 .top-block .date,
.media-s4 .para,
.media-s5 .item span,
.media-s5 .para,
.media-s6 .item .hide span,
.media-s6 .para,
.media-s7 .item .date,
.media-s7 .para,
.portfolio-s2 .table .top-box i,
.portfolio-s2 .table .top-box span,
.portfolio-s2 .table .box .cate span i,
.portfolio-s2 .table .item span,
.portfolio-s4 .table .bot-box span,
.portfolio-s4 .b-para,
.contact-s1 .tab-cont .box span,
.contact-s2 .info p,
.contact-s3 .item .tit,
.contact-s3 input,
.contact-s3 textarea,
.contact-s3 .maxl {
  font-size: 1rem;
}

.font-18,
.footer .bot-block .link a,
.team-pop .tip,
.team-pop .para,
.about-s5 .item p,
.about-s5 a.more,
.about-s6 a.more,
.about-s7 .item .para,
.about-s7 a.more,
.about-s8 a.more,
.about-s9 a.more,
.responsibility-s10 .item p,
.responsibility-s15 .single .btns a,
.investor-s1 a.more,
.investor-s2 .box .s-tit,
.investor-s2 .n-box a,
.investor-s3 a.more,
.investor-s4 a.more,
.investor-s6 .link a,
.investor-s7 .item .btns a,
.investor-s12 a.more,
.media-s7 .link a,
.other-s3 .item .link a,
.index-s1 .item a,
.index-s2 a.more,
.index-s3 a,
.index-s4 .info-box p,
.index-s5 .show a.more,
.index-s5 .hide a.more,
.index-s6 a.more,
.index-s7 a,
.index-s8 .btn a {
  font-size: 1.125rem;
}

.font-20,
.header li a.single,
.header li .subnav .link a span,
.header .info span,
.footer .nav .tit,
.footer .nav .link a,
.footer .right-box span,
.search-s1 .item .tit,
.about-s1 .item .para,
.about-s1 .item .info,
.about-s2 .item .tit,
.about-s3 .item .para,
.about-s4 .para,
.about-s4 .item .tit,
.about-s5 .para,
.about-s8 .item .tit,
.about-s9 .para,
.about-s9 .flex a span,
.responsibility-s1 .para,
.responsibility-s1 .item p,
.responsibility-s2 .para,
.responsibility-s3 .para,
.responsibility-s4 .flex a span,
.responsibility-s5 .para,
.responsibility-s6 .b-para,
.responsibility-s6 .item .tit,
.responsibility-s7 .para,
.responsibility-s9 .b-para,
.responsibility-s10 .para,
.responsibility-s11 .flex a span,
.responsibility-s12 .b-para,
.responsibility-s12 .item .tit,
.responsibility-s13 .para,
.responsibility-s14 .para,
.responsibility-s14 .flex p,
.responsibility-s14 .flex a span,
.responsibility-s15 .para,
.career-s4 .item .tit,
.career-s6 .item .para,
.career-s6 .tips,
.investor-s1 .para,
.investor-s1 .item p,
.investor-s1 .item .num i,
.investor-s2 .link a span,
.investor-s2 .n-box-1 .para,
.investor-s5 .para,
.investor-s8 .para,
.investor-s10 .para,
.investor-s10 table td,
.investor-s11 .item .tit,
.investor-s11 .item .info span,
.investor-s11 .item .info .para,
.media-s1 .item .tit,
.media-s2 .bot-block .item .tit,
.media-s3 a span,
.media-s4 .txt-box a,
.media-s7 .item .tit,
.portfolio-s1 .item .para,
.portfolio-s3 .item .para,
.portfolio-s4 .table .top-box span,
.portfolio-s5 .top-para,
.portfolio-s5 .bot-para p,
.portfolio-s5 .bot-para p:before,
.portfolio-s5 .bot-para .tip,
.portfolio-s6 .item p,
.portfolio-s6 .tip,
.portfolio-s7 .para,
.other-s1 .top-para,
.other-s1 .top-list span,
.other-s1 .top-list .para,
.other-s1 .block .para,
.other-s2 .block .para,
.contact-s1 .para,
.contact-s1 .tab-cont .box p {
  font-size: 1.25rem;
}

.font-22 {
  font-size: 1.375rem;
}

.font-24,
.fixed-search .tips,
.cookie span,
.about-s6 .tab-cont .para,
.about-s6 .tab-tit .item span,
.about-s10 .item .para,
.responsibility-s5 .box .info-txt span,
.responsibility-s7 .item .tit,
.responsibility-s8 .info-txt span,
.responsibility-s9 .item .tit,
.responsibility-s10 .item .tit,
.responsibility-s15 .item span,
.career-s3 .item span,
.career-s5 .item .tit,
.career-s6 .item .tit span,
.career-s6 a.apply,
.career-s7 .item .tit,
.career-s8 .item .tit,
.investor-s2 .n-box span,
.investor-s3 .item .date i,
.investor-s3 .item .tit,
.investor-s6 .item .date i,
.investor-s6 .item .tit,
.investor-s9 .para,
.investor-s11 .label,
.investor-s12 .item .date i,
.investor-s12 .item .tit,
.portfolio-s1 .item .para span,
.portfolio-s6 .item span,
.contact-s1 .tab-tit span,
.contact-s2 .info span,
.contact-s3 button,
.index-s2 .para,
.index-s4 .top-box p,
.index-s4 .info-box .tit,
.index-s5 .para,
.index-s6 .top-box p,
.index-s6 .item span,
.index-s7 .para,
.index-s8 .top-box p {
  font-size: 1.5rem;
}

.font-30 {
  font-size: 1.875rem;
}

.font-32,
.text-modal .tit,
.search-s1 .tips,
.about-s1 .item .tit span,
.about-s3 .item .tit span,
.about-s7 .item .tit,
.responsibility-s2 .item .tit,
.responsibility-s5 .box .tit,
.responsibility-s8 .tit,
.responsibility-s13 .item .tit,
.responsibility-s15 .single .tit,
.investor-s2 .box .tit,
.investor-s2 .box .stock,
.investor-s2 .n-box-1 .tit,
.investor-s4 .item span,
.media-s5 .item .tit,
.portfolio-s2 .c-label .tit,
.other-s1 .block .tit,
.other-s2 .block .tit span,
.other-s3 .item .tit {
  font-size: 2rem;
}

.font-36,
.team-pop .tit,
.about-s3 .item.active .tit span,
.career-s1 .c-label .tit,
.career-s2 .c-label .tit,
.investor-s7 .item .tit,
.media-s4 .txt-box span,
.portfolio-s3 .item .tit span,
.portfolio-s4 .c-label .tit,
.portfolio-s5 .c-label .tit,
.portfolio-s6 .c-label .tit,
.portfolio-s7 .c-label .tit {
  font-size: 2.25rem;
}

.font-40,
.investor-s12 .item .date span {
  font-size: 2.5rem;
}

.font-48,
.header li .subnav .tit,
.c-label .tit,
.about-s10 .item span,
.career-s6 .label,
.media-s2 .top-block .tit,
.index-s1 .item p,
.index-s8 .tit {
  font-size: 3rem;
}

.font-60,
.search-s1 .label,
.about-s4 .center-box:after,
.responsibility-s13 .item span,
.investor-s1 .item .num span,
.investor-s3 .item .date span,
.investor-s6 .item .date span,
.index-s2 .tit,
.index-s3 .tit,
.index-s4 .top-box .tit,
.index-s5 .tit,
.index-s6 .top-box .tit,
.index-s7 .tit,
.index-s8 .top-box .tit {
  font-size: 3.75rem;
}

.font-70 {
  font-size: 4.375rem;
}

.font-80,
.fixed-search .label,
.c-banner .tit,
.index-s1 .item span,
.index-s1 .item .tip {
  font-size: 5rem;
}

.font-90,
.investor-s2 .box .price {
  font-size: 5.625rem;
}

.font-100 {
  font-size: 6.25rem;
}

.font-120 {
  font-size: 7.5rem;
}

@keyframes o-upfade-top {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes o-rotate {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes scale-bg {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(1.1);
  }
}

@keyframes indexsvg {
  0% {
    stroke-dashoffset: 100;
  }

  100% {
    stroke-dashoffset: 0;
  }
}

@keyframes ani-scaleX {
  0% {
    transform: scaleX(0);
  }

  100% {
    transform: scaleX(1);
  }
}

@keyframes banner-ani {
  0% {
    top: 0;
  }

  90%,
  100% {
    top: 100%;
  }
}

@media screen and (min-width: 1025px) {
  .wow {
    visibility: hidden;
  }
}

@media screen and (min-width: 1025px) {
  .dom-loaded .header {
    transition: all .3s ease;
  }

  .dom-loaded .header .logo img {
    transition: all .3s ease;
  }

  .dom-loaded .header li a.single {
    transition: all .3s ease;
  }
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  padding: 0 3.75rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0;
  z-index: 9;
}

.header:hover,
.header.down {
  background-color: #fff;
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05);
}

.header.down .logo img {
  height: 3.375rem;
}

.header.down li a.single {
  line-height: 6.25rem;
}

.header .logo {
  display: inline-block;
  vertical-align: middle;
}

.header .logo img {
  display: block;
  height: 4.5rem;
}

.header ul {
  display: inline-block;
  vertical-align: middle;
}

.header li {
  display: inline-block;
  vertical-align: top;
}

.header li a.single {
  display: block;
  line-height: 8.125rem;
  color: #42474e;
  position: relative;
  padding: 0 1.25rem;
  z-index: 2;
}

.header li a.single:after {
  content: '';
  width: 100%;
  height: 2px;
  background-color: #00639d;
  position: absolute;
  left: 0;
  bottom: 0;
  transform: scaleX(0);
}

.header li .subnav {
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  right: 0;
  background: #fff url("../images/img-5.png") center bottom no-repeat;
  background-size: 100% auto;
  border-top: 1px solid #e6e6e6;
  padding: 5.625rem;
  font-size: 0;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.05);
  opacity: 0;
  visibility: hidden;
}

.header li .subnav .left-box {
  width: 43.34%;
  display: inline-block;
  vertical-align: top;
}

.header li .subnav .tit {
  color: #42474e;
  padding: 0 1.875rem;
  margin-top: -1rem;
}

.header li .subnav .link {
  margin-top: 1.5rem;
}

.header li .subnav .link a {
  display: block;
  width: 27.5rem;
  position: relative;
  margin-top: 5px;
}

.header li .subnav .link a:nth-of-type(1) {
  margin-top: 0;
}

.header li .subnav .link a:before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 5px;
  background-image: url("../images/img-3.jpg");
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
}

.header li .subnav .link a:after {
  content: '';
  width: 5px;
  height: 9px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-1.svg");
  position: absolute;
  right: 1.875rem;
  top: 50%;
  margin-top: -5px;
  z-index: 3;
  opacity: 0;
  transition: opacity .3s ease;
}

.header li .subnav .link a span {
  display: block;
  padding: 0 1.875rem;
  line-height: 3.375rem;
  color: #42474e;
  position: relative;
  z-index: 2;
  transition: color .3s ease;
}

@media (any-hover: hover) {

  .header li .subnav .link a:hover:before,
  .header li .subnav .link a:hover:after {
    opacity: 1;
  }

  .header li .subnav .link a:hover span {
    color: #fff;
  }
}

.header li .subnav .right-box {
  width: 56.66%;
  display: inline-block;
  vertical-align: top;
  border-radius: 10px;
  overflow: hidden;
}

.header li .subnav .right-box img {
  display: block;
  width: 100%;
}

@media screen and (min-width: 1025px) {
  .header li.active a.single:after {
    transform: scaleX(1);
    transition: transform .3s ease;
  }
}

@media (any-hover: hover) {
  .header li:hover a.single:after {
    transform: scaleX(1);
    transition: transform .3s ease;
  }

  .header li:hover .subnav {
    opacity: 1;
    visibility: visible;
    transition: all .3s ease;
  }
}

.header .info {
  display: inline-block;
  vertical-align: middle;
  font-size: 0;
  position: relative;
  margin-left: 1.25rem;
  padding-left: 2.5rem;
}

.header .info:before {
  content: '';
  width: 1px;
  height: 16px;
  background-color: rgba(15, 30, 52, 0.2);
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -8px;
}

.header .info span {
  color: #42474e;
}

.header .info span:before {
  content: '';
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  vertical-align: middle;
  margin: -2px 10px 0 0;
}

.header .search,
.header .global {
  display: inline-block;
  vertical-align: middle;
}

.header .search span,
.header .global span {
  cursor: pointer;
}

.header .search span:before {
  background-image: url("../fonts/search.svg");
}

.header .global {
  margin-left: 3.75rem;
  position: relative;
}

.header .global span:before {
  background-image: url("../fonts/global.svg");
}

.header .global .hide {
  position: absolute;
  width: 90px;
  top: 100%;
  left: 50%;
  margin-left: -45px;
  padding-top: 24px;
  opacity: 0;
  visibility: hidden;
}

.header .global .hide:before {
  content: '';
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
  display: block;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.header .global .hide .box {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
  border-radius: 5px;
  overflow: hidden;
}

.header .global .hide a {
  display: block;
  font-size: 12px;
  line-height: 30px;
  color: #333;
  text-align: center;
  background-color: #fff;
  transition: all .3s ease;
}

@media screen and (min-width: 1025px) {
  .header .global .hide a:hover {
    background-color: #00639d;
    color: #fff;
  }
}

.header .global:hover .hide {
  opacity: 1;
  visibility: visible;
}

.fixed-search {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  background-color: #00639d;
  display: none;
}

.fixed-search .close {
  width: 60px;
  height: 60px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  background-image: url("../fonts/close-1.svg");
  background-size: auto 1.5rem;
  position: absolute;
  top: 3.125vw;
  right: 3.125vw;
  cursor: pointer;
  z-index: 3;
}

.fixed-search .main {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
}

.fixed-search .box {
  width: 90%;
  max-width: 960px;
  margin: 0 auto;
}

.fixed-search .label {
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 4.5vw;
}

.fixed-search input {
  display: block;
  width: 100%;
  height: 6.25rem;
  border-bottom: 4px solid #fff;
  background-color: transparent;
  padding: 0 1.875rem;
  color: rgba(255, 255, 255, 0.5);
}

.fixed-search input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.fixed-search input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.fixed-search input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.fixed-search .tips {
  color: #fff;
  margin-top: 2vw;
}

.fixed-search .link {
  margin-top: 1.25rem;
  font-size: 0;
}

.fixed-search .link a {
  display: inline-block;
  vertical-align: top;
  background-color: rgba(255, 255, 255, 0.2);
  line-height: 2.5rem;
  color: #fff;
  padding: 0 1.875rem;
  margin-right: 10px;
  transition: all .3s ease;
}

.fixed-search .link a:last-of-type {
  margin-right: 0;
}

@media screen and (min-width: 1025px) {
  .fixed-search .link a:hover {
    background-color: #fff;
    color: #00639d;
  }
}

.head-null {
  height: 6.25rem;
}

.footer {
  background-position: center top;
  background-repeat: no-repeat;
  background-image: url("../images/img-1.png");
  background-size: 100% auto;
}

.footer .top-block {
  padding: 5.625rem 0 3.75rem;
  position: relative;
}

.footer .top-block .flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.footer .totop {
  width: 90px;
  height: 90px;
  position: fixed;
  right: 3.75rem;
  bottom: 3.75rem;
  background: #00639d url("../images/totop.svg") center center no-repeat;
  background-size: auto 12px;
  border-radius: 50%;
  z-index: 10;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: all .3s ease;
}

.footer .totop svg {
  position: absolute;
  top: 5%;
  left: 5%;
  width: 90%;
  height: 90%;
  fill: none;
  stroke: #fff;
  stroke-width: 1px;
  stroke-dasharray: 268;
  stroke-dashoffset: 268;
  transform: rotate(-90deg);
}

.footer .totop.active {
  opacity: 1;
  visibility: visible;
}

.footer .left-box {
  width: 30rem;
}

.footer .left-box img {
  display: block;
  height: 3.375rem;
}

.footer .left-box .para {
  margin-top: 2rem;
}

.footer .left-box p {
  color: #42474e;
  line-height: 24px;
  margin-top: 1.5rem;
}

.footer .left-box p:nth-of-type(1) {
  margin-top: 0;
}

.footer .nav .tit {
  color: #42474e;
  font-weight: bold;
}

.footer .nav .link {
  margin-top: 2rem;
}

.footer .nav .link a {
  display: block;
  color: #42474e;
  margin-top: 1.5rem;
  transition: color .3s ease;
}

.footer .nav .link a:nth-of-type(1) {
  margin-top: 0;
}

@media (any-hover: hover) {
  .footer .nav .link a:hover {
    color: #00639d;
  }
}

.footer .right-box {
  width: 30rem;
}

.footer .right-box span {
  color: #42474e;
  font-weight: bold;
}

.footer .form .s-box {
  margin-top: 1rem;
  position: relative;
  width: 100%;
  height: 54px;
}

.footer .form .s-box i {
  display: block;
  width: 100%;
  height: 100%;
  border: 1px solid #e6e6e6;
  background-color: transparent;
  padding: 0 1.25rem;
  line-height: 52px;
  font-style: normal;
  color: #42474e;
}

.footer .form .s-box a {
  position: absolute;
  right: 3px;
  top: 3px;
  width: 120px;
  height: calc(100% - 6px);
  background-color: #00639d;
  border-radius: 3px;
  line-height: 48px;
  color: #fff;
  text-align: center;
  cursor: pointer;
}

.footer .share {
  margin-top: 3.75rem;
}

.footer .share .ewm {
  width: 9.375rem;
  border: 1px solid #e6e6e6;
  margin-top: 1rem;
}

.footer .share .ewm img {
  display: block;
  width: 100%;
}

.footer .bot-block {
  border-top: 1px solid #e6e6e6;
  padding: 2.5rem 0;
}

.footer .bot-block .flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.footer .bot-block .link {
  font-size: 0;
}

.footer .bot-block .link a {
  display: inline-block;
  vertical-align: top;
  color: #42474e;
  margin-right: 1.5rem;
  transition: color .3s ease;
}

.footer .bot-block .link a:last-of-type {
  margin-right: 0;
}

@media (any-hover: hover) {
  .footer .bot-block .link a:hover {
    color: #00639d;
  }
}

.cookie {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-size: 0;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 11;
  display: none;
}

.cookie .main {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../images/img-4.jpg");
  padding: 2.5rem 3.75rem;
  font-size: 0;
}

.cookie .close {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/close.svg");
  position: absolute;
  right: 2rem;
  top: 2rem;
  cursor: pointer;
  transition: transform .3s ease;
}

@media (any-hover: hover) {
  .cookie .close:hover {
    transform: rotate(90deg);
  }
}

.cookie .txt {
  display: inline-block;
  vertical-align: bottom;
  width: 50%;
}

.cookie span {
  display: block;
  color: #42474e;
}

.cookie p {
  color: #42474e;
  line-height: 20px;
  margin-top: 10px;
}

.cookie .link {
  display: inline-block;
  vertical-align: bottom;
  margin-left: 15rem;
}

.cookie a {
  display: inline-block;
  vertical-align: top;
  width: 180px;
  line-height: 48px;
  color: #fff;
  text-align: center;
  border-radius: 5px;
}

.cookie a:nth-of-type(1) {
  background-color: #00639d;
}

.cookie a:nth-of-type(2) {
  background-color: #00a0e9;
  margin-left: 10px;
}

@media screen and (max-width: 1800px) {
  html {
    font-size: 15px;
  }
}

@media screen and (max-width: 1681px) {
  html {
    font-size: 14px;
  }

  .font-20,
  .header li a.single,
  .header li .subnav .link a span,
  .header .info span,
  .footer .nav .tit,
  .footer .nav .link a,
  .footer .right-box span,
  .search-s1 .item .tit,
  .about-s1 .item .para,
  .about-s1 .item .info,
  .about-s2 .item .tit,
  .about-s3 .item .para,
  .about-s4 .para,
  .about-s4 .item .tit,
  .about-s5 .para,
  .about-s8 .item .tit,
  .about-s9 .para,
  .about-s9 .flex a span,
  .responsibility-s1 .para,
  .responsibility-s1 .item p,
  .responsibility-s2 .para,
  .responsibility-s3 .para,
  .responsibility-s4 .flex a span,
  .responsibility-s5 .para,
  .responsibility-s6 .b-para,
  .responsibility-s6 .item .tit,
  .responsibility-s7 .para,
  .responsibility-s9 .b-para,
  .responsibility-s10 .para,
  .responsibility-s11 .flex a span,
  .responsibility-s12 .b-para,
  .responsibility-s12 .item .tit,
  .responsibility-s13 .para,
  .responsibility-s14 .para,
  .responsibility-s14 .flex p,
  .responsibility-s14 .flex a span,
  .responsibility-s15 .para,
  .career-s4 .item .tit,
  .career-s6 .item .para,
  .career-s6 .tips,
  .investor-s1 .para,
  .investor-s1 .item p,
  .investor-s1 .item .num i,
  .investor-s2 .link a span,
  .investor-s2 .n-box-1 .para,
  .investor-s5 .para,
  .investor-s8 .para,
  .investor-s10 .para,
  .investor-s10 table td,
  .investor-s11 .item .tit,
  .investor-s11 .item .info span,
  .investor-s11 .item .info .para,
  .media-s1 .item .tit,
  .media-s2 .bot-block .item .tit,
  .media-s3 a span,
  .media-s4 .txt-box a,
  .media-s7 .item .tit,
  .portfolio-s1 .item .para,
  .portfolio-s3 .item .para,
  .portfolio-s4 .table .top-box span,
  .portfolio-s5 .top-para,
  .portfolio-s5 .bot-para p,
  .portfolio-s5 .bot-para p:before,
  .portfolio-s5 .bot-para .tip,
  .portfolio-s6 .item p,
  .portfolio-s6 .tip,
  .portfolio-s7 .para,
  .other-s1 .top-para,
  .other-s1 .top-list span,
  .other-s1 .top-list .para,
  .other-s1 .block .para,
  .other-s2 .block .para,
  .contact-s1 .para,
  .contact-s1 .tab-cont .box p {
    font-size: 18px;
  }

  .font-18,
  .footer .bot-block .link a,
  .team-pop .tip,
  .team-pop .para,
  .about-s5 .item p,
  .about-s5 a.more,
  .about-s6 a.more,
  .about-s7 .item .para,
  .about-s7 a.more,
  .about-s8 a.more,
  .about-s9 a.more,
  .responsibility-s10 .item p,
  .responsibility-s15 .single .btns a,
  .investor-s1 a.more,
  .investor-s2 .box .s-tit,
  .investor-s2 .n-box a,
  .investor-s3 a.more,
  .investor-s4 a.more,
  .investor-s6 .link a,
  .investor-s7 .item .btns a,
  .investor-s12 a.more,
  .media-s7 .link a,
  .other-s3 .item .link a,
  .index-s1 .item a,
  .index-s2 a.more,
  .index-s3 a,
  .index-s4 .info-box p,
  .index-s5 .show a.more,
  .index-s5 .hide a.more,
  .index-s6 a.more,
  .index-s7 a,
  .index-s8 .btn a {
    font-size: 16px;
  }
}

@media screen and (max-width: 1441px) {
  html {
    font-size: 13px;
  }

  .font-22 {
    font-size: 18px;
  }

  .font-20,
  .header li a.single,
  .header li .subnav .link a span,
  .header .info span,
  .footer .nav .tit,
  .footer .nav .link a,
  .footer .right-box span,
  .search-s1 .item .tit,
  .about-s1 .item .para,
  .about-s1 .item .info,
  .about-s2 .item .tit,
  .about-s3 .item .para,
  .about-s4 .para,
  .about-s4 .item .tit,
  .about-s5 .para,
  .about-s8 .item .tit,
  .about-s9 .para,
  .about-s9 .flex a span,
  .responsibility-s1 .para,
  .responsibility-s1 .item p,
  .responsibility-s2 .para,
  .responsibility-s3 .para,
  .responsibility-s4 .flex a span,
  .responsibility-s5 .para,
  .responsibility-s6 .b-para,
  .responsibility-s6 .item .tit,
  .responsibility-s7 .para,
  .responsibility-s9 .b-para,
  .responsibility-s10 .para,
  .responsibility-s11 .flex a span,
  .responsibility-s12 .b-para,
  .responsibility-s12 .item .tit,
  .responsibility-s13 .para,
  .responsibility-s14 .para,
  .responsibility-s14 .flex p,
  .responsibility-s14 .flex a span,
  .responsibility-s15 .para,
  .career-s4 .item .tit,
  .career-s6 .item .para,
  .career-s6 .tips,
  .investor-s1 .para,
  .investor-s1 .item p,
  .investor-s1 .item .num i,
  .investor-s2 .link a span,
  .investor-s2 .n-box-1 .para,
  .investor-s5 .para,
  .investor-s8 .para,
  .investor-s10 .para,
  .investor-s10 table td,
  .investor-s11 .item .tit,
  .investor-s11 .item .info span,
  .investor-s11 .item .info .para,
  .media-s1 .item .tit,
  .media-s2 .bot-block .item .tit,
  .media-s3 a span,
  .media-s4 .txt-box a,
  .media-s7 .item .tit,
  .portfolio-s1 .item .para,
  .portfolio-s3 .item .para,
  .portfolio-s4 .table .top-box span,
  .portfolio-s5 .top-para,
  .portfolio-s5 .bot-para p,
  .portfolio-s5 .bot-para p:before,
  .portfolio-s5 .bot-para .tip,
  .portfolio-s6 .item p,
  .portfolio-s6 .tip,
  .portfolio-s7 .para,
  .other-s1 .top-para,
  .other-s1 .top-list span,
  .other-s1 .top-list .para,
  .other-s1 .block .para,
  .other-s2 .block .para,
  .contact-s1 .para,
  .contact-s1 .tab-cont .box p {
    font-size: 16px;
  }

  .font-18,
  .footer .bot-block .link a,
  .team-pop .tip,
  .team-pop .para,
  .about-s5 .item p,
  .about-s5 a.more,
  .about-s6 a.more,
  .about-s7 .item .para,
  .about-s7 a.more,
  .about-s8 a.more,
  .about-s9 a.more,
  .responsibility-s10 .item p,
  .responsibility-s15 .single .btns a,
  .investor-s1 a.more,
  .investor-s2 .box .s-tit,
  .investor-s2 .n-box a,
  .investor-s3 a.more,
  .investor-s4 a.more,
  .investor-s6 .link a,
  .investor-s7 .item .btns a,
  .investor-s12 a.more,
  .media-s7 .link a,
  .other-s3 .item .link a,
  .index-s1 .item a,
  .index-s2 a.more,
  .index-s3 a,
  .index-s4 .info-box p,
  .index-s5 .show a.more,
  .index-s5 .hide a.more,
  .index-s6 a.more,
  .index-s7 a,
  .index-s8 .btn a {
    font-size: 14px;
  }

  .font-16,
  .fixed-search input,
  .fixed-search .link a,
  .cookie a,
  .c-subnav a,
  .comm-page li a,
  .text-modal .para,
  .search-s1 .form input,
  .search-s1 .link a,
  .search-s1 .item span,
  .search-s1 .item p,
  .about-s2 .item .tip,
  .about-s7 .pagination span,
  .about-s10 .r-box span,
  .responsibility-s5 .box .info-txt p,
  .responsibility-s7 .item p,
  .responsibility-s8 .info-txt p,
  .responsibility-s9 .item .para,
  .responsibility-s12 .item p,
  .responsibility-s15 .item .btns a,
  .career-s2 .filter .year-box span,
  .career-s2 .filter .year-box .hide a,
  .career-s2 .filter .form input,
  .career-s3 .item p,
  .career-s4 .item p,
  .career-s5 .item .info span,
  .career-s5 .item p,
  .career-s5 .item a,
  .career-s6 .info span,
  .career-s7 .item .para,
  .career-s8 .item .para,
  .investor-s3 .item p,
  .investor-s6 .item .s-date,
  .investor-s6 .item p,
  .media-s1 .filter .form input,
  .media-s1 .filter .year-box span,
  .media-s1 .filter .year-box .hide a,
  .media-s1 .item .date,
  .media-s1 .item p,
  .media-s2 .top-block .date,
  .media-s4 .para,
  .media-s5 .item span,
  .media-s5 .para,
  .media-s6 .item .hide span,
  .media-s6 .para,
  .media-s7 .item .date,
  .media-s7 .para,
  .portfolio-s2 .table .top-box i,
  .portfolio-s2 .table .top-box span,
  .portfolio-s2 .table .box .cate span i,
  .portfolio-s2 .table .item span,
  .portfolio-s4 .table .bot-box span,
  .portfolio-s4 .b-para,
  .contact-s1 .tab-cont .box span,
  .contact-s2 .info p,
  .contact-s3 .item .tit,
  .contact-s3 input,
  .contact-s3 textarea,
  .contact-s3 .maxl {
    font-size: 14px;
  }

  .font-14,
  .footer .left-box p,
  .footer .form .s-box i,
  .footer .form .s-box a,
  .cookie p,
  .c-crumbs a,
  .investor-s2 .box span,
  .investor-s2 .box .tip,
  .media-s7 .item .top-box span,
  .portfolio-s2 .table .box .cate span {
    font-size: 14px;
  }
}

@media screen and (max-width: 1367px) {
  html {
    font-size: 12px;
  }
}

@media screen and (max-width: 1281px) {
  html {
    font-size: 10px;
  }

  .font-24,
  .fixed-search .tips,
  .cookie span,
  .about-s6 .tab-cont .para,
  .about-s6 .tab-tit .item span,
  .about-s10 .item .para,
  .responsibility-s5 .box .info-txt span,
  .responsibility-s7 .item .tit,
  .responsibility-s8 .info-txt span,
  .responsibility-s9 .item .tit,
  .responsibility-s10 .item .tit,
  .responsibility-s15 .item span,
  .career-s3 .item span,
  .career-s5 .item .tit,
  .career-s6 .item .tit span,
  .career-s6 a.apply,
  .career-s7 .item .tit,
  .career-s8 .item .tit,
  .investor-s2 .n-box span,
  .investor-s3 .item .date i,
  .investor-s3 .item .tit,
  .investor-s6 .item .date i,
  .investor-s6 .item .tit,
  .investor-s9 .para,
  .investor-s11 .label,
  .investor-s12 .item .date i,
  .investor-s12 .item .tit,
  .portfolio-s1 .item .para span,
  .portfolio-s6 .item span,
  .contact-s1 .tab-tit span,
  .contact-s2 .info span,
  .contact-s3 button,
  .index-s2 .para,
  .index-s4 .top-box p,
  .index-s4 .info-box .tit,
  .index-s5 .para,
  .index-s6 .top-box p,
  .index-s6 .item span,
  .index-s7 .para,
  .index-s8 .top-box p {
    font-size: 16px;
  }

  .font-22 {
    font-size: 16px;
  }
}

@media screen and (max-width: 1025px) {
  html {
    font-size: 10px;
  }

  .font-120 {
    font-size: 6rem;
  }

  .font-100 {
    font-size: 4rem;
  }

  .font-90,
  .investor-s2 .box .price {
    font-size: 3.6rem;
  }

  .font-80,
  .fixed-search .label,
  .c-banner .tit,
  .index-s1 .item span,
  .index-s1 .item .tip {
    font-size: 3.2rem;
  }

  .font-70 {
    font-size: 2.8rem;
  }

  .font-60,
  .search-s1 .label,
  .about-s4 .center-box:after,
  .responsibility-s13 .item span,
  .investor-s1 .item .num span,
  .investor-s3 .item .date span,
  .investor-s6 .item .date span,
  .index-s2 .tit,
  .index-s3 .tit,
  .index-s4 .top-box .tit,
  .index-s5 .tit,
  .index-s6 .top-box .tit,
  .index-s7 .tit,
  .index-s8 .top-box .tit {
    font-size: 2.4rem;
  }

  .font-48,
  .header li .subnav .tit,
  .c-label .tit,
  .about-s10 .item span,
  .career-s6 .label,
  .media-s2 .top-block .tit,
  .index-s1 .item p,
  .index-s8 .tit {
    font-size: 2rem;
  }

  .font-40,
  .investor-s12 .item .date span {
    font-size: 2rem;
  }

  .font-36,
  .team-pop .tit,
  .about-s3 .item.active .tit span,
  .career-s1 .c-label .tit,
  .career-s2 .c-label .tit,
  .investor-s7 .item .tit,
  .media-s4 .txt-box span,
  .portfolio-s3 .item .tit span,
  .portfolio-s4 .c-label .tit,
  .portfolio-s5 .c-label .tit,
  .portfolio-s6 .c-label .tit,
  .portfolio-s7 .c-label .tit {
    font-size: 2rem;
  }

  .font-32,
  .text-modal .tit,
  .search-s1 .tips,
  .about-s1 .item .tit span,
  .about-s3 .item .tit span,
  .about-s7 .item .tit,
  .responsibility-s2 .item .tit,
  .responsibility-s5 .box .tit,
  .responsibility-s8 .tit,
  .responsibility-s13 .item .tit,
  .responsibility-s15 .single .tit,
  .investor-s2 .box .tit,
  .investor-s2 .box .stock,
  .investor-s2 .n-box-1 .tit,
  .investor-s4 .item span,
  .media-s5 .item .tit,
  .portfolio-s2 .c-label .tit,
  .other-s1 .block .tit,
  .other-s2 .block .tit span,
  .other-s3 .item .tit {
    font-size: 1.8rem;
  }

  .font-30 {
    font-size: 1.8rem;
  }

  .font-24,
  .fixed-search .tips,
  .cookie span,
  .about-s6 .tab-cont .para,
  .about-s6 .tab-tit .item span,
  .about-s10 .item .para,
  .responsibility-s5 .box .info-txt span,
  .responsibility-s7 .item .tit,
  .responsibility-s8 .info-txt span,
  .responsibility-s9 .item .tit,
  .responsibility-s10 .item .tit,
  .responsibility-s15 .item span,
  .career-s3 .item span,
  .career-s5 .item .tit,
  .career-s6 .item .tit span,
  .career-s6 a.apply,
  .career-s7 .item .tit,
  .career-s8 .item .tit,
  .investor-s2 .n-box span,
  .investor-s3 .item .date i,
  .investor-s3 .item .tit,
  .investor-s6 .item .date i,
  .investor-s6 .item .tit,
  .investor-s9 .para,
  .investor-s11 .label,
  .investor-s12 .item .date i,
  .investor-s12 .item .tit,
  .portfolio-s1 .item .para span,
  .portfolio-s6 .item span,
  .contact-s1 .tab-tit span,
  .contact-s2 .info span,
  .contact-s3 button,
  .index-s2 .para,
  .index-s4 .top-box p,
  .index-s4 .info-box .tit,
  .index-s5 .para,
  .index-s6 .top-box p,
  .index-s6 .item span,
  .index-s7 .para,
  .index-s8 .top-box p {
    font-size: 1.6rem;
  }

  .font-20,
  .header li a.single,
  .header li .subnav .link a span,
  .header .info span,
  .footer .nav .tit,
  .footer .nav .link a,
  .footer .right-box span,
  .search-s1 .item .tit,
  .about-s1 .item .para,
  .about-s1 .item .info,
  .about-s2 .item .tit,
  .about-s3 .item .para,
  .about-s4 .para,
  .about-s4 .item .tit,
  .about-s5 .para,
  .about-s8 .item .tit,
  .about-s9 .para,
  .about-s9 .flex a span,
  .responsibility-s1 .para,
  .responsibility-s1 .item p,
  .responsibility-s2 .para,
  .responsibility-s3 .para,
  .responsibility-s4 .flex a span,
  .responsibility-s5 .para,
  .responsibility-s6 .b-para,
  .responsibility-s6 .item .tit,
  .responsibility-s7 .para,
  .responsibility-s9 .b-para,
  .responsibility-s10 .para,
  .responsibility-s11 .flex a span,
  .responsibility-s12 .b-para,
  .responsibility-s12 .item .tit,
  .responsibility-s13 .para,
  .responsibility-s14 .para,
  .responsibility-s14 .flex p,
  .responsibility-s14 .flex a span,
  .responsibility-s15 .para,
  .career-s4 .item .tit,
  .career-s6 .item .para,
  .career-s6 .tips,
  .investor-s1 .para,
  .investor-s1 .item p,
  .investor-s1 .item .num i,
  .investor-s2 .link a span,
  .investor-s2 .n-box-1 .para,
  .investor-s5 .para,
  .investor-s8 .para,
  .investor-s10 .para,
  .investor-s10 table td,
  .investor-s11 .item .tit,
  .investor-s11 .item .info span,
  .investor-s11 .item .info .para,
  .media-s1 .item .tit,
  .media-s2 .bot-block .item .tit,
  .media-s3 a span,
  .media-s4 .txt-box a,
  .media-s7 .item .tit,
  .portfolio-s1 .item .para,
  .portfolio-s3 .item .para,
  .portfolio-s4 .table .top-box span,
  .portfolio-s5 .top-para,
  .portfolio-s5 .bot-para p,
  .portfolio-s5 .bot-para p:before,
  .portfolio-s5 .bot-para .tip,
  .portfolio-s6 .item p,
  .portfolio-s6 .tip,
  .portfolio-s7 .para,
  .other-s1 .top-para,
  .other-s1 .top-list span,
  .other-s1 .top-list .para,
  .other-s1 .block .para,
  .other-s2 .block .para,
  .contact-s1 .para,
  .contact-s1 .tab-cont .box p {
    font-size: 1.4rem;
  }

  .font-18,
  .footer .bot-block .link a,
  .team-pop .tip,
  .team-pop .para,
  .about-s5 .item p,
  .about-s5 a.more,
  .about-s6 a.more,
  .about-s7 .item .para,
  .about-s7 a.more,
  .about-s8 a.more,
  .about-s9 a.more,
  .responsibility-s10 .item p,
  .responsibility-s15 .single .btns a,
  .investor-s1 a.more,
  .investor-s2 .box .s-tit,
  .investor-s2 .n-box a,
  .investor-s3 a.more,
  .investor-s4 a.more,
  .investor-s6 .link a,
  .investor-s7 .item .btns a,
  .investor-s12 a.more,
  .media-s7 .link a,
  .other-s3 .item .link a,
  .index-s1 .item a,
  .index-s2 a.more,
  .index-s3 a,
  .index-s4 .info-box p,
  .index-s5 .show a.more,
  .index-s5 .hide a.more,
  .index-s6 a.more,
  .index-s7 a,
  .index-s8 .btn a {
    font-size: 1.4rem;
  }

  .mNavBtn {
    display: block;
    width: 20px;
    height: 16px;
    right: 5%;
    top: 22px;
    position: fixed;
    cursor: pointer;
    z-index: 4;
  }

  .mNavBtn span {
    position: absolute;
    left: 0;
    width: 20px;
    height: 2px;
    background-color: #333;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }

  .mNavBtn span.line1 {
    top: 0;
  }

  .mNavBtn span.line2 {
    top: 7px;
  }

  .mNavBtn span.line3 {
    bottom: 0;
  }

  .mNavBtn.active .line2 {
    display: none;
  }

  .mNavBtn.active .line1 {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 7px;
  }

  .mNavBtn.active .line3 {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    bottom: 7px;
  }

  .header {
    height: 60px;
    padding: 0 5%;
    background-color: #ffffff;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  }

  .header .logo img {
    height: 4rem !important;
  }

  .header .info {
    margin-right: 35px;
    margin-left: 0;
    padding-left: 0;
  }

  .header .info:before {
    display: none;
  }

  .header .global {
    margin-left: 15px;
  }

  .header ul {
    position: fixed;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%;
    background-color: #fff;
    padding: 70px 30px;
    text-align: left;
    z-index: 3;
    transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    overflow: auto;
  }

  .header ul.active {
    left: 0;
  }

  .header li {
    position: relative;
    display: block;
    border-bottom: 1px solid #e6e6e6;
  }

  .header li i {
    width: 50px;
    height: 50px;
    position: absolute;
    right: 0;
    top: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../images/icon-2-1.png");
    background-size: auto 9px;
  }

  .header li a.single {
    line-height: 50px !important;
    font-size: 16px;
    color: #333;
    padding: 0;
    margin-right: 50px;
  }

  .header li a.single:before {
    display: none;
  }

  .header li .subnav {
    position: static;
    opacity: 1;
    visibility: visible;
    background: none;
    box-shadow: none;
    padding: 10px 0;
    display: none;
  }

  .header li .subnav .right-box {
    display: none;
  }

  .header li .subnav .left-box {
    width: 100%;
  }

  .header li .subnav .tit {
    display: none;
  }

  .header li .subnav .link {
    margin-top: 0;
  }

  .header li .subnav .link a {
    width: 100%;
    margin-top: 0;
  }

  .header li .subnav .link a:after,
  .header li .subnav .link a:before {
    display: none;
  }

  .header li .subnav .link a span {
    padding: 0;
  }

  .fixed-search .link a {
    margin-bottom: 10px;
  }

  .header .global .hide {
    padding-top: 10px;
  }

  .footer .top-block {
    padding: 3rem 0;
  }

  .footer .top-block .flex {
    display: block;
  }

  .footer .top-block .nav {
    display: none;
  }

  .footer .left-box {
    width: 100%;
  }

  .footer .left-box img {
    display: none;
  }

  .footer .left-box .para {
    margin-top: 0;
  }

  .footer .left-box p {
    margin-top: 1rem;
  }

  .footer .right-box {
    width: 100%;
    margin-top: 2rem;
  }

  .footer .share {
    display: none;
  }

  .footer .bot-block {
    padding: 2rem 0;
  }

  .footer .bot-block .flex {
    display: block;
  }

  .footer .bot-block .link:nth-of-type(2) {
    margin-top: 1rem;
  }

  .footer .totop {
    display: none;
  }
}

.wrap-s {
  width: 80%;
  max-width: 1440px;
  margin: 0 auto;
  position: relative;
  z-index: 3;
}

.wrap-s.max {
  max-width: 1200px;
}

.c-bg-fixed,
.responsibility-s3,
.investor-s1,
.investor-s2,
.investor-s8,
.index-s3,
.index-s5,
.index-s7 {
  background-attachment: fixed;
}

.c-crumbs {
  font-size: 0;
  position: relative;
  z-index: 2;
}

.c-crumbs a {
  display: inline-block;
  vertical-align: top;
  line-height: 4.375rem;
  color: #fff;
  position: relative;
  margin-right: calc(2.5rem + 5px);
}

.c-crumbs a:after {
  content: '';
  width: 5px;
  height: 9px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-2.png");
  position: absolute;
  right: calc(-1.25rem - 5px);
  top: 50%;
  margin-top: -4px;
}

.c-crumbs a:last-of-type {
  margin-right: 0;
}

.c-crumbs a:last-of-type:after {
  display: none;
}

.c-crumbs.gray a {
  color: #42474e;
}

.c-crumbs.gray a:after {
  background-image: url("../images/icon-2-1.png");
}

.c-banner {
  position: relative;
  margin-top: -4.375rem;
}

.c-banner .img-box {
  overflow: hidden;
}

.c-banner img {
  display: block;
  width: 100%;
  animation: scale-bg 6s linear forwards;
}

.c-banner .txt-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.c-banner .tit {
  color: #fff;
  width: 70%;
}

.c-subnav {
  background-color: #f2f7fa;
  font-size: 0;
}

.c-subnav a {
  display: inline-block;
  vertical-align: top;
  line-height: 5rem;
  margin-right: 5.625rem;
  position: relative;
}

.c-subnav a:last-of-type {
  margin-right: 0;
}

.c-subnav a:after {
  content: '';
  width: 100%;
  height: 4px;
  background-color: #00639d;
  position: absolute;
  bottom: 0;
  left: 0;
  transform: scaleX(0);
  will-change: transform;
}

.c-subnav a.active {
  color: #00639d;
}

.c-subnav a.active:after {
  transform: scaleX(1);
}

@media (any-hover: hover) {
  .c-subnav a:hover {
    color: #00639d;
  }

  .c-subnav a:hover:after {
    transform: scaleX(1);
    transition: transform .3s ease;
  }
}

.c-label .tit {
  color: #00639d;
  text-align: center;
}

.comm-page {
  font-size: 0;
  text-align: center;
}

.comm-page li {
  display: inline-block;
  vertical-align: top;
  margin: 0 5px;
}

.comm-page li:after {
  display: none;
}

.comm-page li a {
  display: block;
  width: 3rem;
  height: 3rem;
  color: #42474e;
  line-height: 3rem;
  text-align: center;
  border-radius: 6px;
  transition: all .3s ease;
}

.comm-page li:first-of-type a,
.comm-page li:last-of-type a {
  width: auto;
  padding: 0 1.25rem;
}

.comm-page li.active a {
  background-color: #00639e;
  color: #fff;
}

@media (any-hover: hover) {
  .comm-page li:not(.active):hover a {
    background-color: #f2f7fa;
  }
}

.video-pop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9;
  display: none;
}

.video-pop .bg {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1;
}

.video-pop .close {
  width: 32px;
  height: 32px;
  position: absolute;
  right: 20px;
  top: 20px;
  background: url("../images/close-1.svg") center no-repeat;
  -webkit-transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  transition: all 500ms ease;
  cursor: pointer;
  z-index: 2;
}

@media (any-hover: hover) {
  .video-pop .close:hover {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
  }
}

.video-pop video {
  position: absolute;
  top: 50%;
  left: 50%;
  max-height: 80%;
  max-width: 80%;
  z-index: 3;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.text-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 11;
  background-color: rgba(255, 255, 255, 0.8);
  -webkit-backdrop-filter: blur(25px);
  backdrop-filter: blur(25px);
  display: none;
}

.text-modal .close {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #00639d;
  background-image: url("../fonts/icon-2-2.svg");
  background-size: auto 1.5rem;
  transform: rotate(45deg);
  position: absolute;
  right: 1.875rem;
  top: 1.875rem;
  cursor: pointer;
}

.text-modal .main {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 1.25rem 2.5rem rgba(0, 0, 0, 0.3);
  padding: 5rem 7.5rem;
}

.text-modal .tit {
  color: #42474e;
}

.text-modal .para {
  color: #42474e;
  line-height: 1.6;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e6e6e6;
  text-align: justify;
}

.team-pop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 11;
  background-color: rgba(0, 0, 0, 0.5);
  display: none;
}

.team-pop .close {
  width: 2.6875rem;
  height: 2.6875rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../fonts/icon-2.svg");
  position: absolute;
  right: 1.875rem;
  top: 1.875rem;
  cursor: pointer;
}

.team-pop .main {
  max-width: 1320px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff url("../images/img-2.png") center bottom no-repeat;
  background-size: 100% auto;
  border-radius: 20px;
  padding: 3.75rem;
}

.team-pop .flex {
  display: flex;
  align-items: center;
}

.team-pop .img-box {
  width: 22.5rem;
  height: 30rem;
  border-radius: 10px;
  overflow: hidden;
}

.team-pop .img-box img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-pop .txt-box {
  width: calc(100% - 22.5rem);
  padding-left: 3.75rem;
}

.team-pop .tit {
  color: #00639d;
}

.team-pop .tip {
  color: #00639d;
}

.team-pop .para {
  margin-top: 1rem;
  color: #42474e;
  line-height: 1.8;
  margin-right: -20px;
  padding-right: 20px;
  max-height: 18rem;
  overflow: auto;
  text-align: justify;
}

.search-s1 {
  padding: 7.5rem 0;
  position: relative;
  z-index: 2;
}

.search-s1 .label {
  text-align: center;
  color: #00639d;
}

.search-s1 .form {
  width: 83%;
  margin: 2.5rem auto 0;
  position: relative;
  background-color: #fff;
  padding-right: 5rem;
  box-shadow: 0 0 30px rgba(12, 51, 136, 0.08);
}

.search-s1 .form input {
  display: block;
  width: 100%;
  height: 5rem;
  padding: 0 2rem;
  color: #808080;
  background-color: transparent;
}

.search-s1 .form button {
  width: 5rem;
  height: 5rem;
  position: absolute;
  right: 0;
  top: 0;
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../images/search.svg");
  background-size: auto 1.5rem;
  cursor: pointer;
}

.search-s1 .link {
  margin-top: 3.75rem;
  text-align: center;
  font-size: 0;
}

.search-s1 .link a {
  display: inline-block;
  vertical-align: top;
  color: #333;
  margin-left: 5.625rem;
}

.search-s1 .link a i {
  display: inline-block;
  vertical-align: middle;
  width: 1.75rem;
  height: 1.75rem;
  border: 1px solid #808080;
  border-radius: 50%;
  position: relative;
  margin: -2px 10px 0 0;
}

.search-s1 .link a i:before {
  content: '';
  width: 60%;
  height: 60%;
  border-radius: 50%;
  background-color: #00639d;
  position: absolute;
  top: 20%;
  left: 20%;
  opacity: 0;
  transition: opacity .3s ease;
}

.search-s1 .link a:nth-of-type(1) {
  margin-left: 0;
}

.search-s1 .link a.active i {
  border-color: #00639d;
}

.search-s1 .link a.active i:before {
  opacity: 1;
}

.search-s1 .ani {
  position: relative;
  width: 1px;
  height: 7.5rem;
  margin: 7.5rem auto 0;
  background-color: #e6e6e6;
}

.search-s1 .ani:before {
  content: '';
  width: 1px;
  height: 1.25rem;
  background-color: #00639d;
  position: absolute;
  top: 0;
  left: 0;
  animation: banner-ani 1.5s linear infinite;
}

.search-s1 .tips {
  color: #333;
  margin-top: 2.5rem;
}

.search-s1 .tips span {
  color: #00639d;
}

.search-s1 .items {
  margin: 2.5rem 0;
}

.search-s1 .item {
  position: relative;
}

.search-s1 .item:before,
.search-s1 .item:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 8px;
}

.search-s1 .item:before {
  background-color: #f2f2f2;
}

.search-s1 .item:after {
  background-color: #00639d;
  transform: scaleX(0);
  transform-origin: left top;
}

.search-s1 .item a {
  position: relative;
  display: block;
  padding: 2.5rem 0;
}

.search-s1 .item i {
  width: 1.25rem;
  height: 1.25rem;
  position: absolute;
  top: 2.5rem;
  right: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../fonts/icon-3.svg");
}

.search-s1 .item span,
.search-s1 .item p {
  display: block;
  color: #808080;
}

.search-s1 .item .tit {
  margin: 1.5rem 0;
  color: #333;
  transition: color .3s ease;
}

@media (any-hover: hover) {
  .search-s1 .item:hover:after {
    transform: scaleX(1);
    transition: transform .5s linear;
  }

  .search-s1 .item:hover .tit {
    color: #00639d;
  }
}

.about-s1 {
  padding: 7.5rem 0;
}

.about-s1.nopt {
  padding-top: 0;
}

.about-s1 .item {
  margin-top: 6.25rem;
}

.about-s1 .item:nth-of-type(1) {
  margin-top: 0;
}

.about-s1 .item .tit {
  position: relative;
  border-bottom: 1px solid #e6e6e6;
  cursor: pointer;
}

.about-s1 .item .tit span {
  display: inline-block;
  color: #00639d;
  padding-bottom: 1rem;
  position: relative;
}

.about-s1 .item .tit span:after {
  content: '';
  width: 100%;
  height: 1px;
  background-color: #00639d;
  position: absolute;
  bottom: -1px;
  left: 0;
}

.about-s1 .item .para {
  color: #42474e;
  line-height: 1.8;
  margin-top: 2rem;
  text-align: justify;
}

.about-s1 .item .info {
  color: #42474e;
  margin-top: 2rem;
}

.about-s1 .item .info:before {
  content: '';
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  background-color: #00639d;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../fonts/icon-1.svg");
  background-size: auto 1rem;
}

.about-s1 .item .info a {
  color: #00639d;
}

.about-s2 {
  padding: 7.5rem 0;
}

.about-s2 .items {
  display: flex;
  flex-wrap: wrap;
}

.about-s2 .item {
  width: calc((100% - 4.5rem) / 4);
  margin: 1.5rem 1.5rem 0 0;
  cursor: pointer;
}

.about-s2 .item .img-box {
  height: 25rem;
  border-radius: 10px 10px 0 0;
  overflow: hidden;
}

.about-s2 .item img {
  display: block;
  width: 100%;
}

.about-s2 .item .txt-box {
  padding: 2.5rem 1.25rem;
  background-image: linear-gradient(180deg, #dfe0e0, 30%, #ffffff);
  text-align: center;
}

.about-s2 .item .tit {
  color: #42474e;
}

.about-s2 .item .tip {
  color: #42474e;
  margin-top: 10px;
}

.about-s2 .item .para {
  display: none;
}

@media screen and (min-width: 769px) {

  .about-s2 .item:nth-of-type(1),
  .about-s2 .item:nth-of-type(2),
  .about-s2 .item:nth-of-type(3),
  .about-s2 .item:nth-of-type(4) {
    margin-top: 0;
  }

  .about-s2 .item:nth-of-type(4n) {
    margin-right: 0;
  }
}

.about-s3 {
  padding: 5rem 0 7.5rem;
}

.about-s3 .item {
  border-bottom: 1px solid #e6e6e6;
}

.about-s3 .item .tit {
  height: 10.625rem;
  position: relative;
  padding: 0 2.5rem;
  cursor: pointer;
}

.about-s3 .item .tit:after {
  content: '';
  width: 3rem;
  height: 3rem;
  position: absolute;
  right: 2.5rem;
  top: 50%;
  margin-top: -1.5rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../fonts/icon-3-1.svg");
}

.about-s3 .item .tit span {
  display: block;
  max-width: calc(100% - 5rem);
  color: #00639d;
  transition: all .3s ease;
}

.about-s3 .item .hide {
  font-size: 0;
  padding: 0 2.5rem 3.75rem;
  display: none;
  margin-top: -1.5rem;
  position: relative;
  z-index: 2;
}

.about-s3 .item .para {
  display: inline-block;
  vertical-align: top;
  color: #42474e;
  line-height: 1.8;
  text-align: justify;
}

.about-s3 .item .img-box {
  width: 22.5rem;
  display: inline-block;
  vertical-align: top;
  border-radius: 10px;
  overflow: hidden;
}

.about-s3 .item .img-box img {
  display: block;
  width: 100%;
}

.about-s3 .item.pic .para {
  width: calc(100% - 22.5rem);
  padding-left: 3.75rem;
}

.about-s3 .item.active .tit:after {
  background-image: url("../fonts/icon-3-2.svg");
}

.about-s3 .item.active .hide {
  display: block;
}

.about-s4 {
  padding: 7.5rem 0;
}

.about-s4 .para {
  color: #42474e;
  line-height: 1.8;
  text-align: justify;
}

.about-s4 .block {
  margin: 3.75rem 0;
  position: relative;
}

.about-s4 .center-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 17.5rem;
  height: 17.5rem;
  border-radius: 50%;
  background-color: #fff;
  z-index: 2;
}

.about-s4 .center-box:before {
  content: '';
  width: 85%;
  height: 85%;
  position: absolute;
  top: 7.5%;
  left: 7.5%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/img-13.png");
  animation: o-rotate 20s linear infinite;
}

.about-s4 .center-box:after {
  content: 'CASI';
  color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.about-s4 .items {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  z-index: 1;
}

.about-s4 .item {
  display: inline-block;
  vertical-align: top;
  width: calc((100% - 1.5rem) / 2);
  height: 18.75rem;
  background-color: #f2f7fa;
  position: relative;
  cursor: pointer;
  overflow: hidden;
  transition: all .3s ease;
}

.about-s4 .item:before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #00639d;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
  z-index: 1;
}

.about-s4 .item .b-icon {
  width: 32rem;
  height: 32rem;
  position: absolute;
  top: 1.875rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 2;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.about-s4 .item .box {
  height: 100%;
  position: relative;
  z-index: 3;
}

.about-s4 .item .icon {
  width: 3rem;
  height: 3rem;
  position: absolute;
  top: 2.5rem;
}

.about-s4 .item i {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity .3s ease;
  will-change: opacity;
}

.about-s4 .item i.hide {
  opacity: 0;
}

.about-s4 .item .tit {
  color: #42474e;
  width: calc(100% - 10rem);
  position: absolute;
  bottom: 2.5rem;
  transition: color .3s ease;
}

@media screen and (min-width: 769px) {

  .about-s4 .item:nth-of-type(1) .b-icon,
  .about-s4 .item:nth-of-type(3) .b-icon {
    left: 10rem;
  }

  .about-s4 .item:nth-of-type(1) .icon,
  .about-s4 .item:nth-of-type(3) .icon {
    left: 2.5rem;
  }

  .about-s4 .item:nth-of-type(1) .tit,
  .about-s4 .item:nth-of-type(3) .tit {
    left: 2.5rem;
  }

  .about-s4 .item:nth-of-type(2),
  .about-s4 .item:nth-of-type(4) {
    margin-left: 1.5rem;
  }

  .about-s4 .item:nth-of-type(2) .icon,
  .about-s4 .item:nth-of-type(4) .icon {
    right: 2.5rem;
  }

  .about-s4 .item:nth-of-type(2) .tit,
  .about-s4 .item:nth-of-type(4) .tit {
    text-align: right;
    right: 2.5rem;
  }

  .about-s4 .item:nth-of-type(3),
  .about-s4 .item:nth-of-type(4) {
    margin-top: 1.5rem;
  }

  .about-s4 .item:nth-of-type(1) {
    border-radius: 10px 0 0 0;
  }

  .about-s4 .item:nth-of-type(2) {
    border-radius: 0 10px 0 0;
  }

  .about-s4 .item:nth-of-type(4) {
    border-radius: 0 0 10px 0;
  }

  .about-s4 .item:nth-of-type(3) {
    border-radius: 0 0 0 10px;
  }
}

@media (any-hover: hover) {
  .about-s4 .item:hover {
    box-shadow: 0 0.625rem 1.875rem rgba(0, 99, 157, 0.3);
  }

  .about-s4 .item:hover:before {
    opacity: 1;
  }

  .about-s4 .item:hover .b-icon {
    opacity: 0.1;
  }

  .about-s4 .item:hover i.show {
    opacity: 0;
  }

  .about-s4 .item:hover i.hide {
    opacity: 1;
  }

  .about-s4 .item:hover .tit {
    color: #fff;
  }
}

.about-s5 {
  padding: 7.5rem 0;
}

.about-s5 .para {
  color: #42474e;
  line-height: 1.8;
  margin-top: 2rem;
  text-align: center;
}

.about-s5 .items {
  margin-top: 6.25rem;
  display: flex;
}

.about-s5 .item {
  flex: 1;
  margin-left: 1.5rem;
  background-color: #f2f7fa;
  border-radius: 10px;
  padding: 3.75rem 2.5rem;
}

.about-s5 .item i {
  display: block;
  margin: 0 auto;
  width: 7.375rem;
  height: 7.375rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  will-change: transform;
}

.about-s5 .item p {
  color: #42474e;
  text-align: center;
  margin-top: 1.5rem;
}

@media screen and (min-width: 769px) {
  .about-s5 .item:nth-of-type(1) {
    margin-left: 0;
  }

  .about-s5 .item:nth-of-type(odd) {
    transform: translateY(-3.75rem);
  }
}

@media (any-hover: hover) {
  .about-s5 .item:hover i {
    transform: rotateY(360deg);
    transition: transform .8s ease;
  }
}

.about-s5 a.more {
  display: block;
  width: 15rem;
  margin: 2.5rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .about-s5 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.about-s6 {
  padding: 3.75rem 0;
}

.about-s6 .tab-cont .child {
  position: relative;
  padding-bottom: 4rem;
  display: none;
}

.about-s6 .tab-cont .child.active {
  display: block;
}

.about-s6 .tab-cont .child.active .para {
  animation: o-upfade-top 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.about-s6 .tab-cont .year {
  text-align: center;
}

.about-s6 .tab-cont .year span {
  display: inline-block;
  font-size: 31.25rem;
  line-height: 1;
  font-family: 'Krub-Bold';
  color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../images/img-4.jpg");
  -webkit-background-clip: text;
  background-clip: text;
}

.about-s6 .tab-cont .text {
  width: 100%;
  height: 10rem;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.5);
  -webkit-backdrop-filter: blur(25px);
  backdrop-filter: blur(25px);
}

.about-s6 .tab-cont .para {
  color: #42474e;
  text-align: center;
  opacity: 0;
}

.about-s6 .tab-tit {
  text-align: center;
  font-size: 0;
}

.about-s6 .tab-tit .item {
  position: relative;
  width: 8.75rem;
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
}

.about-s6 .tab-tit .item:after {
  content: '';
  width: 2.125rem;
  height: 2px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/img-5.png");
  position: absolute;
  right: 0;
  top: 1.25rem;
  margin-top: -1px;
  transform: translateX(50%);
}

.about-s6 .tab-tit .item i {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  margin: 0 auto;
  border: 2px solid #42474e;
  border-radius: 50%;
  position: relative;
}

.about-s6 .tab-tit .item i:before {
  content: '';
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background-color: #00639d;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.about-s6 .tab-tit .item span {
  display: block;
  text-align: center;
  margin-top: 1rem;
  color: #d9d9d9;
}

.about-s6 .tab-tit .item:last-of-type:after {
  display: none;
}

.about-s6 .tab-tit .item.active i {
  border-color: #00639d;
}

.about-s6 .tab-tit .item.active i:before {
  opacity: 1;
}

.about-s6 .tab-tit .item.active span {
  color: #00639d;
}

@media (any-hover: hover) {
  .about-s6 .tab-tit .item:hover i {
    border-color: #00639d;
  }

  .about-s6 .tab-tit .item:hover i:before {
    opacity: 1;
  }

  .about-s6 .tab-tit .item:hover span {
    color: #00639d;
  }
}

.about-s6 a.more {
  display: block;
  width: 15rem;
  margin: 3.75rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .about-s6 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.about-s7 {
  padding: 7.5rem 0;
  overflow: hidden;
}

.about-s7 .swiper {
  margin: 2.5rem -12px 0;
  padding: 0 calc(50% - 600px);
}

.about-s7 .item {
  height: 24rem;
  padding: 0 12px;
  opacity: 0.1;
  transition: opacity .3s ease;
  will-change: opacity;
}

.about-s7 .item .box {
  position: relative;
  height: 100%;
  background: #00639d url("../images/img-6.png") center bottom no-repeat;
  background-size: 100% auto;
  border-radius: 30px;
  overflow: hidden;
}

.about-s7 .item .txt-box {
  height: 100%;
  position: relative;
  padding: 3.75rem;
}

.about-s7 .item .tit {
  color: #fff;
}

.about-s7 .item .para {
  line-height: 1.8;
  color: #fff;
  margin-top: 1.5rem;
  text-align: justify;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.about-s7 .item a {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../fonts/icon-5-1.svg");
  position: absolute;
  bottom: 3.75rem;
  left: 3.75rem;
  transition: transform .3s ease;
  will-change: transform;
}

.about-s7 .item.pic .img-box {
  width: 21.5rem;
  position: absolute;
  left: 3.75rem;
  bottom: 0;
}

.about-s7 .item.pic .img-box img {
  display: block;
  width: 100%;
}

.about-s7 .item.pic .txt-box {
  width: 60%;
  margin-left: 40%;
}

.about-s7 .item.swiper-slide-active {
  opacity: 1;
}

.about-s7 .pagination {
  text-align: center;
  margin-top: 2.5rem;
}

.about-s7 .pagination span {
  display: inline-block;
  vertical-align: middle;
  color: #d9d9d9;
}

.about-s7 .pagination span.curr {
  color: #00639d;
}

.about-s7 .pagination .line {
  display: inline-block;
  vertical-align: middle;
  width: 15rem;
  height: 2px;
  background-color: #e5e5e5;
  margin: 0 1.5rem;
  position: relative;
}

.about-s7 .pagination .line:before {
  content: '';
  width: 100%;
  height: 2px;
  background-color: #00639d;
  position: absolute;
  top: 0;
  left: 0;
  transform: scaleX(0);
  transform-origin: left top;
}

.about-s7 .pagination .line.active:before {
  animation: ani-scaleX 5s linear forwards;
}

.about-s7 a.more {
  display: block;
  width: 15rem;
  margin: 2.5rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .about-s7 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.about-s8 {
  padding: 3.75rem 0;
}

.about-s8 .items {
  margin-top: 2.5rem;
}

.about-s8 .swiper {
  padding: 0 calc(50vw - 720px);
}

.about-s8 .item {
  position: relative;
  width: calc((100% - 4.5rem) / 4);
  height: auto;
  background-color: #f2f7fa;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
}

.about-s8 .item .img-box {
  overflow: hidden;
}

.about-s8 .item img {
  display: block;
  width: 100%;
}

.about-s8 .item .txt-box {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 5rem 2.5rem 2.5rem;
  z-index: 2;
}

.about-s8 .item .txt-box:before {
  content: '';
  width: 100%;
  height: 100%;
  background-image: linear-gradient(180deg, transparent, #000000);
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: opacity .3s ease;
  will-change: opacity;
}

.about-s8 .item .txt-box:after {
  content: '';
  width: 100%;
  height: 100%;
  background-image: linear-gradient(180deg, transparent, #00639d);
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.about-s8 .item .tit {
  color: #fff;
  position: relative;
  z-index: 2;
}

.about-s8 .item .tip,
.about-s8 .item .para {
  display: none;
}

@media (any-hover: hover) {
  .about-s8 .item:hover .txt-box:before {
    opacity: 0;
  }

  .about-s8 .item:hover .txt-box:after {
    opacity: 1;
  }
}

.about-s8 .swiper-control {
  position: relative;
  width: 33.75rem;
  height: 12px;
  margin: 3.75rem auto 0;
  padding: 4px 2.5rem;
}

.about-s8 .swiper-scrollbar {
  height: 4px;
}

.about-s8 .swiper-scrollbar-drag {
  background-color: #00639d;
}

.about-s8 .button {
  width: 7px;
  height: 12px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  margin-top: -6px;
  cursor: pointer;
  transition: transform .3s ease;
  will-change: transform;
}

.about-s8 .prev {
  left: 0;
  background-image: url("../fonts/prev.svg");
}

@media (any-hover: hover) {
  .about-s8 .prev:hover {
    transform: translateX(-3px);
  }
}

.about-s8 .next {
  right: 0;
  background-image: url("../fonts/next.svg");
}

@media (any-hover: hover) {
  .about-s8 .next:hover {
    transform: translateX(3px);
  }
}

.about-s8 a.more {
  display: block;
  width: 15rem;
  margin: 3.75rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .about-s8 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.about-s9 {
  padding: 7.5rem 0 11.25rem;
}

.about-s9.nopt {
  padding-top: 0;
}

.about-s9 .para {
  color: #42474e;
  line-height: 1.6;
  margin-top: 2rem;
}

.about-s9 .flex {
  margin-top: 2.5rem;
  display: flex;
  align-items: center;
}

.about-s9 .flex .img-box {
  width: 50%;
  border-radius: 10px;
  overflow: hidden;
}

.about-s9 .flex .img-box img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

@media (any-hover: hover) {
  .about-s9 .flex .img-box:hover img {
    transform: scale(1.1);
  }
}

.about-s9 .flex .txt-box {
  width: 50%;
  padding-left: 3.75rem;
}

.about-s9 .flex a {
  display: block;
  position: relative;
  border-top: 1px solid #e6e6e6;
  padding: 1.5rem 5rem 1.5rem 2.5rem;
}

.about-s9 .flex a:last-of-type {
  border-bottom: 1px solid #e6e6e6;
}

.about-s9 .flex a:before {
  content: '';
  position: absolute;
  top: 3px;
  right: 0;
  bottom: 3px;
  left: 0;
  background-color: #f2f7fa;
  border-radius: 10px;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.about-s9 .flex a:after {
  content: '';
  width: 1.25rem;
  height: 1.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../fonts/icon-6.svg");
  position: absolute;
  right: 2.5rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.about-s9 .flex a span {
  display: block;
  line-height: 1.6;
  color: #42474e;
  position: relative;
  z-index: 2;
}

@media (any-hover: hover) {
  .about-s9 .flex a:hover:before {
    opacity: 1;
  }
}

.about-s9 a.more {
  display: block;
  width: 15rem;
  margin: 2.5rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .about-s9 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.about-s10 {
  position: relative;
  padding: 7.5rem 0;
}

.about-s10 .r-box {
  width: 5.625rem;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
}

.about-s10 .r-box .cell-box {
  height: 100vh;
  position: sticky;
  top: 0;
}

.about-s10 .r-box span {
  display: block;
  color: #000000;
  margin-top: 1.5rem;
  cursor: pointer;
  position: relative;
}

.about-s10 .r-box span:after {
  content: '';
  width: 12px;
  height: 4px;
  background-color: #00639d;
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -2px;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.about-s10 .r-box span:nth-of-type(1) {
  margin-top: 0;
}

.about-s10 .r-box span.active {
  color: #00639d;
}

.about-s10 .r-box span.active:after {
  opacity: 1;
}

.about-s10 .year-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.about-s10 .year-box .cell-box {
  height: 100vh;
  position: sticky;
  top: 0;
}

.about-s10 .year-box span {
  display: block;
  text-align: center;
  font-size: 37.5rem;
  color: #fff;
  text-shadow: 2.5rem 5rem 5rem rgba(0, 99, 157, 0.1);
}

.about-s10 .line {
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -2px;
  width: 4px;
  height: 100%;
  background: url("../images/icon-11.png") center top repeat-y;
  z-index: 1;
  overflow: hidden;
}

.about-s10 .line span {
  width: 100%;
  background-color: #00639d;
  position: absolute;
  top: 0;
  left: 0;
}

.about-s10 .icon {
  width: 9.375rem;
  height: 9.375rem;
  margin: 0 auto;
  position: relative;
  border-radius: 50%;
  background-color: #e5eff5;
  z-index: 2;
}

.about-s10 .icon:before {
  content: '';
  width: 80%;
  height: 80%;
  position: absolute;
  top: 10%;
  left: 10%;
  border: .625rem solid #00639d;
  border-radius: 50%;
  background-color: #fff;
  box-sizing: border-box;
}

.about-s10 .icon i {
  width: 3rem;
  height: 3rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-10.png");
}

.about-s10 .items {
  padding: 5rem 0;
  position: relative;
  z-index: 2;
}

.about-s10 .item {
  width: 50%;
  min-height: 27.5rem;
  margin-top: -6.25rem;
}

.about-s10 .item span {
  position: relative;
  display: block;
  font-family: 'Krub-Bold';
  color: #42474e;
  transition: color .3s ease;
}

.about-s10 .item span:before {
  content: '';
  width: 1.5rem;
  height: 1.5rem;
  box-sizing: border-box;
  border-radius: 50%;
  background-color: #fff;
  border: 4px solid #00639d;
  position: absolute;
  top: 50%;
}

.about-s10 .item .para {
  color: #42474e;
  line-height: 1.6;
  margin-top: 1rem;
}

.about-s10 .item .img-box {
  display: inline-block;
  width: 30rem;
  border-radius: 10px;
  overflow: hidden;
  margin-top: 2.5rem;
}

.about-s10 .item .img-box img {
  display: block;
  width: 100%;
}

.about-s10 .item:nth-of-type(1) {
  margin-top: 0;
}

@media screen and (min-width: 769px) {
  .about-s10 .item:nth-of-type(odd) {
    padding-right: 7.5rem;
    text-align: right;
  }

  .about-s10 .item:nth-of-type(odd) span:before {
    right: -7.5rem;
    transform: translate(50%, -50%);
  }

  .about-s10 .item:nth-of-type(even) {
    margin-left: 50%;
    padding-left: 7.5rem;
    text-align: left;
  }

  .about-s10 .item:nth-of-type(even) span:before {
    left: -7.5rem;
    transform: translate(-50%, -50%);
  }
}

.about-s10 .item.active span {
  color: #00639d;
}

.responsibility-s1 {
  padding: 7.5rem 0;
}

.responsibility-s1 .para {
  color: #42474e;
  line-height: 1.6;
  text-align: center;
  margin-top: 2rem;
}

.responsibility-s1 .para.t-left {
  text-align: left;
}

.responsibility-s1 .items {
  margin-top: 3.75rem;
}

.responsibility-s1 .items.nomt {
  margin-top: 0;
}

.responsibility-s1 .item {
  display: flex;
  align-items: center;
  margin-top: 3.75rem;
}

.responsibility-s1 .item:nth-of-type(1) {
  margin-top: 0;
}

.responsibility-s1 .item .img-box {
  width: 50%;
  border-radius: 10px;
  overflow: hidden;
}

.responsibility-s1 .item img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

.responsibility-s1 .item .txt-box {
  width: 50%;
}

.responsibility-s1 .item p {
  color: #42474e;
  line-height: 1.6;
}

@media screen and (min-width: 769px) {
  .responsibility-s1 .item:nth-of-type(odd) .txt-box {
    padding-left: 3.75rem;
  }

  .responsibility-s1 .item:nth-of-type(even) .txt-box {
    padding-right: 3.75rem;
    order: -1;
  }
}

@media (any-hover: hover) {
  .responsibility-s1 .item:hover img {
    transform: scale(1.1);
  }
}

.responsibility-s2 {
  padding: 3.75rem 0 7.5rem;
}

.responsibility-s2 .para {
  color: #42474e;
  line-height: 1.6;
  text-align: center;
  margin-top: 2rem;
}

.responsibility-s2 .items {
  margin-top: 3.75rem;
  display: flex;
}

.responsibility-s2 .item {
  flex: 1;
  background-color: #f2f7fa;
  padding: 3.75rem 2.5rem 2.5rem;
  border-radius: 10px;
  cursor: pointer;
}

.responsibility-s2 .item:after {
  content: '';
  display: block;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../fonts/icon-2-1.svg");
  background-size: auto 1.5rem;
  margin: 2.5rem auto 0;
  transition: all .3s ease;
}

.responsibility-s2 .item i {
  display: block;
  margin: 0 auto;
  width: 6.75rem;
  height: 6.75rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.responsibility-s2 .item .tit {
  color: #42474e;
  text-align: center;
  margin-top: 2.5rem;
  transition: color .3s ease;
}

.responsibility-s2 .item .text-modal-para {
  display: none;
}

.responsibility-s2 .item:nth-of-type(2) {
  margin-left: 1.5rem;
}

@media (any-hover: hover) {
  .responsibility-s2 .item:hover:after {
    background-color: #00639d;
    background-image: url("../fonts/icon-2-2.svg");
  }

  .responsibility-s2 .item:hover .tit {
    color: #00639d;
  }
}

.responsibility-s3 {
  padding: 7.5rem 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.responsibility-s3.style-1 {
  background-image: url("../images/img-2.jpg");
}

.responsibility-s3.style-2 {
  background-image: url("../images/img-4.jpg");
}

.responsibility-s3 .c-label .tit {
  color: #ffffff;
}

.responsibility-s3 .para {
  color: #ffffff;
  line-height: 1.6;
  margin-top: 2.5rem;
}

.responsibility-s3 .para ul {
  padding-left: 2.5rem;
}

.responsibility-s4 {
  padding: 11.25rem 0;
}

.responsibility-s4 .flex {
  margin-top: 2.5rem;
  display: flex;
  align-items: flex-start;
}

.responsibility-s4 .flex .img-box {
  width: 50%;
  border-radius: 10px;
  overflow: hidden;
}

.responsibility-s4 .flex .img-box img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

@media (any-hover: hover) {
  .responsibility-s4 .flex .img-box:hover img {
    transform: scale(1.1);
  }
}

.responsibility-s4 .flex .txt-box {
  width: 50%;
  padding: 3.125rem 0 0 3.75rem;
}

.responsibility-s4 .flex a {
  display: block;
  position: relative;
  border-top: 1px solid #e6e6e6;
  padding: 1.5rem 5rem 1.5rem 2.5rem;
}

.responsibility-s4 .flex a:last-of-type {
  border-bottom: 1px solid #e6e6e6;
}

.responsibility-s4 .flex a:before {
  content: '';
  position: absolute;
  top: 3px;
  right: 0;
  bottom: 3px;
  left: 0;
  background-color: #f2f7fa;
  border-radius: 10px;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.responsibility-s4 .flex a:after {
  content: '';
  width: 1.25rem;
  height: 1.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-3.svg");
  position: absolute;
  right: 2.5rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.responsibility-s4 .flex a span {
  display: block;
  line-height: 1.6;
  color: #42474e;
  position: relative;
  z-index: 2;
}

@media (any-hover: hover) {
  .responsibility-s4 .flex a:hover:before {
    opacity: 1;
  }
}

.responsibility-s5 {
  padding: 7.5rem 0;
}

.responsibility-s5 .para {
  color: #42474e;
  line-height: 1.6;
  text-align: center;
  margin-top: 2rem;
}

.responsibility-s5 .para.t-left {
  text-align: left;
  text-align: justify;
}

.responsibility-s5 .cont {
  margin-top: 2.5rem;
}

.responsibility-s5 .cont.nomt {
  margin-top: 0;
}

.responsibility-s5 .img-box {
  border-radius: 10px;
  overflow: hidden;
}

.responsibility-s5 .img-box img {
  display: block;
  width: 100%;
}

.responsibility-s5 .txt-box {
  margin-top: -15rem;
  padding: 0 7.5rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.responsibility-s5 .txt-box:after {
  content: '';
  width: 6rem;
  height: 5.0625rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/img-6.png");
}

.responsibility-s5 .box {
  background-color: #fff;
  border-radius: 10px;
  width: calc(100% - 15rem);
  padding: 3.75rem;
}

.responsibility-s5 .box .tit {
  color: #42474e;
  line-height: 1.6;
  text-align: justify;
}

.responsibility-s5 .box .info {
  display: flex;
  align-items: center;
  margin-top: 2.5rem;
}

.responsibility-s5 .box .info-img {
  width: 7.5rem;
  border-radius: 10px;
  overflow: hidden;
}

.responsibility-s5 .box .info-img img {
  display: block;
  width: 100%;
}

.responsibility-s5 .box .info-txt {
  width: calc(100% - 7.5rem);
  padding-left: 2.5rem;
}

.responsibility-s5 .box .info-txt span {
  display: block;
  color: #00639d;
}

.responsibility-s5 .box .info-txt p {
  color: #42474e;
}

.responsibility-s6 {
  padding: 0 0 11.25rem;
}

.responsibility-s6.pt {
  padding-top: 7.5rem;
}

.responsibility-s6 .top-block.mt {
  margin-top: 2.5rem;
}

.responsibility-s6 .b-para {
  color: #42474e;
  line-height: 1.6;
  text-align: justify;
}

.responsibility-s6 .items {
  margin-top: 2.5rem;
  overflow: hidden;
}

.responsibility-s6 .swiper {
  padding: 0 calc(50vw - 720px);
}

.responsibility-s6 .swiper-wrapper {
  padding-bottom: 2.5rem;
}

.responsibility-s6 .item {
  width: calc((100% - 4.5rem) / 4);
  height: auto;
  background-color: #f2f7fa;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
}

.responsibility-s6 .item .img-box {
  overflow: hidden;
}

.responsibility-s6 .item .img-box.small {
  position: relative;
  height: 12.5rem;
}

.responsibility-s6 .item .img-box.small img {
  position: absolute;
  right: -15%;
  top: 0;
  height: 100%;
  width: auto;
}

.responsibility-s6 .item img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

.responsibility-s6 .item .txt-box {
  padding: 2.5rem;
  height: 15rem;
  position: relative;
}

.responsibility-s6 .item .txt-box:after {
  content: '';
  width: 3rem;
  height: 3rem;
  position: absolute;
  right: 1.75rem;
  bottom: 1.75rem;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 50%;
  background-image: url("../fonts/icon-5.svg");
  background-size: auto 1.5rem;
  transition: all .3s ease;
}

.responsibility-s6 .item .tit {
  color: #42474e;
}

.responsibility-s6 .item .text-modal-para {
  display: none;
}

.responsibility-s6 .item:nth-of-type(even) {
  transform: translateY(2.5rem);
}

@media (any-hover: hover) {
  .responsibility-s6 .item:hover img {
    transform: scale(1.1);
  }

  .responsibility-s6 .item:hover .txt-box:after {
    background-color: #00639d;
    background-image: url("../fonts/icon-5-1.svg");
  }
}

.responsibility-s6 .swiper-control {
  position: relative;
  width: 33.75rem;
  height: 12px;
  margin: 2.5rem auto 0;
  padding: 4px 2.5rem;
}

.responsibility-s6 .swiper-scrollbar {
  height: 4px;
}

.responsibility-s6 .swiper-scrollbar-drag {
  background-color: #00639d;
}

.responsibility-s6 .button {
  width: 7px;
  height: 12px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  margin-top: -6px;
  cursor: pointer;
  transition: transform .3s ease;
  will-change: transform;
}

.responsibility-s6 .prev {
  left: 0;
  background-image: url("../fonts/prev.svg");
}

@media (any-hover: hover) {
  .responsibility-s6 .prev:hover {
    transform: translateX(-3px);
  }
}

.responsibility-s6 .next {
  right: 0;
  background-image: url("../fonts/next.svg");
}

@media (any-hover: hover) {
  .responsibility-s6 .next:hover {
    transform: translateX(3px);
  }
}

.responsibility-s7 {
  padding-bottom: 11.25rem;
}

.responsibility-s7.pt {
  padding-top: 7.5rem;
}

.responsibility-s7 .para {
  color: #42474e;
  line-height: 1.6;
  text-align: center;
}

.responsibility-s7 .para.t-left {
  text-align: left;
  text-align: justify;
}

.responsibility-s7 .para.mt {
  margin-top: 6.25rem;
}

.responsibility-s7 .items {
  margin-top: 2.5rem;
  display: flex;
}

.responsibility-s7 .item {
  flex: 1;
  height: 30rem;
  position: relative;
  background-color: #f2f7fa;
  padding: 5.625rem 2.5rem;
  border-radius: 10px;
  cursor: pointer;
  margin-left: 1.5rem;
}

.responsibility-s7 .item:after {
  content: '';
  position: absolute;
  bottom: 2.5rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  display: block;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../fonts/icon-2-1.svg");
  background-size: auto 1.5rem;
  transition: all .3s ease;
}

.responsibility-s7 .item i {
  display: block;
  margin: 0 auto;
  width: 6.75rem;
  height: 6.75rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.responsibility-s7 .item .tit {
  color: #42474e;
  text-align: center;
  margin-top: 2.5rem;
  transition: color .3s ease;
}

.responsibility-s7 .item .text-modal-para {
  display: none;
}

.responsibility-s7 .item p {
  color: #42474e;
  line-height: 1.6;
  margin-top: 1.25rem;
  text-align: justify;
}

.responsibility-s7 .item.flip {
  padding: 0;
  background-color: transparent;
  -webkit-perspective: 800px;
  perspective: 800px;
  cursor: pointer;
}

.responsibility-s7 .item.flip:after {
  display: none;
}

.responsibility-s7 .item.flip .box {
  position: relative;
  height: 100%;
  will-change: transform;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  transition: transform .5s ease;
}

.responsibility-s7 .item.flip .show {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
  background-color: #f2f7fa;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 2;
}

.responsibility-s7 .item.flip .show:after {
  content: '';
  width: 3rem;
  height: 3rem;
  position: absolute;
  right: 1.75rem;
  bottom: 1.75rem;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../fonts/icon-5.svg");
  background-size: auto 1.5rem;
  transition: all .3s ease;
}

.responsibility-s7 .item.flip .show p {
  display: none;
}

.responsibility-s7 .item.flip .hide {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 2.5rem;
  border-radius: 10px;
  overflow: hidden;
  background-color: #f2f7fa;
  transform: rotateY(-180deg);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}

.responsibility-s7 .item.flip .hide .tit {
  text-align: left;
  margin-top: 0;
}

.responsibility-s7 .item.flip .hide:after {
  content: '';
  width: 3rem;
  height: 3rem;
  position: absolute;
  right: 1.75rem;
  bottom: 1.75rem;
  background-color: #00639d;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  transform: rotate(45deg);
  background-image: url("../fonts/icon-5-1.svg");
  background-size: auto 1.5rem;
}

.responsibility-s7 .item.active .box {
  transform: rotateY(180deg);
}

.responsibility-s7 .item:nth-of-type(1) {
  margin: 0;
}

@media screen and (min-width: 769px) {
  .responsibility-s7 .item:nth-of-type(2) {
    transform: translateY(3.75rem);
  }
}

@media (any-hover: hover) {
  .responsibility-s7 .item:hover:after {
    background-color: #00639d;
    background-image: url("../fonts/icon-2-2.svg");
  }

  .responsibility-s7 .item:hover .tit {
    color: #00639d;
  }

  .responsibility-s7 .item:hover .show:after {
    background-color: #00639d;
    background-image: url("../fonts/icon-5-1.svg");
  }
}

.responsibility-s8 {
  padding: 7.5rem 0;
  background: #00639d url("../images/img-9.png") center bottom no-repeat;
  background-size: 100% auto;
}

.responsibility-s8 .tit {
  padding-top: 5rem;
  color: #ffffff;
  line-height: 1.6;
  text-align: center;
  background: url("../images/img-10.png") center top no-repeat;
  background-size: 11.9375rem auto;
}

.responsibility-s8 .info {
  margin-top: 2.5rem;
}

.responsibility-s8 .info-img {
  width: 7.5rem;
  margin: 0 auto;
  border-radius: 10px;
  overflow: hidden;
}

.responsibility-s8 .info-img img {
  display: block;
  width: 100%;
}

.responsibility-s8 .info-txt {
  margin-top: 2rem;
  text-align: center;
}

.responsibility-s8 .info-txt span {
  display: block;
  color: #ffffff;
}

.responsibility-s8 .info-txt p {
  color: #ffffff;
}

.responsibility-s9 {
  padding: 7.5rem 0;
}

.responsibility-s9 .b-para {
  color: #42474e;
  line-height: 1.6;
  text-align: center;
  margin-top: 2rem;
}

.responsibility-s9 .b-para.t-left {
  text-align: left;
  text-align: justify;
}

.responsibility-s9 .b-para.nomt {
  margin-top: 0;
}

.responsibility-s9 .items {
  margin-top: 2.5rem;
  display: flex;
}

.responsibility-s9 .item {
  flex: 1;
  height: 30rem;
  margin-left: 1.5rem;
  -webkit-perspective: 800px;
  perspective: 800px;
  cursor: pointer;
}

.responsibility-s9 .item .box {
  position: relative;
  height: 100%;
  will-change: transform;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  transition: transform .5s ease;
}

.responsibility-s9 .item .show {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
  background-color: #f2f7fa;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 2;
}

.responsibility-s9 .item .show:after {
  content: '';
  width: 3rem;
  height: 3rem;
  position: absolute;
  right: 1.75rem;
  bottom: 1.75rem;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../images/icon-5.svg");
  background-size: auto 1.5rem;
  transition: all .3s ease;
}

.responsibility-s9 .item .hide {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 2.5rem;
  border-radius: 10px;
  overflow: hidden;
  background-color: #f2f7fa;
  transform: rotateY(-180deg);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}

.responsibility-s9 .item .hide:after {
  content: '';
  width: 3rem;
  height: 3rem;
  position: absolute;
  right: 1.75rem;
  bottom: 1.75rem;
  background-color: #00639d;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  transform: rotate(45deg);
  background-image: url("../fonts/icon-5-1.svg");
  background-size: auto 1.5rem;
}

.responsibility-s9 .item .img-box {
  overflow: hidden;
}

.responsibility-s9 .item img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

.responsibility-s9 .item .txt-box {
  padding: 2.5rem;
}

.responsibility-s9 .item .tit {
  color: #42474e;
}

.responsibility-s9 .item .para {
  color: #42474e;
  line-height: 1.6;
  margin-top: 1.25rem;
  text-align: justify;
}

.responsibility-s9 .item:nth-of-type(1) {
  margin: 0;
}

.responsibility-s9 .item:nth-of-type(even) {
  margin-top: 2.5rem;
}

.responsibility-s9 .item.active .box {
  transform: rotateY(180deg);
}

@media (any-hover: hover) {
  .responsibility-s9 .item:hover img {
    transform: scale(1.1);
  }

  .responsibility-s9 .item:hover .show:after {
    background-color: #00639d;
    background-image: url("../fonts/icon-5-1.svg");
  }
}

.responsibility-s10 {
  padding: 7.5rem 0;
}

.responsibility-s10 .para {
  color: #42474e;
  line-height: 1.6;
  margin-top: 2rem;
}

.responsibility-s10 .items {
  margin-top: 2.5rem;
  display: flex;
}

.responsibility-s10 .item {
  flex: 1;
  background-color: #f2f7fa;
  padding: 3.75rem 2.5rem 2.5rem;
  border-radius: 10px;
  cursor: pointer;
}

.responsibility-s10 .item:after {
  content: '';
  display: block;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../fonts/icon-2-1.svg");
  background-size: auto 1.5rem;
  margin: 2.5rem auto 0;
  transition: all .3s ease;
}

.responsibility-s10 .item i {
  display: block;
  margin: 0 auto;
  width: 6.75rem;
  height: 6.75rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.responsibility-s10 .item .tit {
  color: #42474e;
  text-align: center;
  margin-top: 1rem;
  transition: color .3s ease;
}

.responsibility-s10 .item p {
  color: #42474e;
  text-align: center;
  margin-top: 1rem;
}

.responsibility-s10 .item .text-modal-para {
  display: none;
}

.responsibility-s10 .item:nth-of-type(2) {
  margin-left: 1.5rem;
}

@media (any-hover: hover) {
  .responsibility-s10 .item:hover:after {
    background-color: #00639d;
    background-image: url("../fonts/icon-2-2.svg");
  }

  .responsibility-s10 .item:hover .tit {
    color: #00639d;
  }
}

.responsibility-s11 .flex {
  display: flex;
  align-items: center;
}

.responsibility-s11 .flex .img-box {
  width: calc((100% - 1.5rem) / 2);
}

.responsibility-s11 .flex .img-box img {
  display: block;
  width: 100%;
}

.responsibility-s11 .flex .txt-box {
  width: calc((100% - 1.5rem) / 2);
  margin-left: 1.5rem;
}

.responsibility-s11 .flex a {
  display: block;
  position: relative;
  border-top: 1px solid #e6e6e6;
  padding: 1rem 5rem 1rem 2.5rem;
}

.responsibility-s11 .flex a:last-of-type {
  border-bottom: 1px solid #e6e6e6;
}

.responsibility-s11 .flex a:before {
  content: '';
  position: absolute;
  top: 3px;
  right: 0;
  bottom: 3px;
  left: 0;
  background-color: #f2f7fa;
  border-radius: 10px;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.responsibility-s11 .flex a:after {
  content: '';
  width: 1.375rem;
  height: 1.375rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../fonts/icon-6.svg");
  position: absolute;
  right: 2.5rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.responsibility-s11 .flex a span {
  display: block;
  color: #42474e;
  position: relative;
  z-index: 2;
}

@media (any-hover: hover) {
  .responsibility-s11 .flex a:hover:before {
    opacity: 1;
  }
}

.responsibility-s12 {
  padding: 7.5rem 0;
}

.responsibility-s12 .top-block.mt {
  margin-top: 2.5rem;
}

.responsibility-s12 .b-para {
  color: #42474e;
  line-height: 1.6;
}

.responsibility-s12 .items {
  margin-top: 2.5rem;
}

.responsibility-s12 .swiper {
  padding: 0 calc(50vw - 720px);
}

.responsibility-s12 .swiper-wrapper {
  padding-bottom: 2.5rem;
}

.responsibility-s12 .item {
  width: calc((100% - 4.5rem) / 4);
  height: auto;
  background-color: #f2f7fa;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
}

.responsibility-s12 .item .img-box {
  overflow: hidden;
}

.responsibility-s12 .item img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

.responsibility-s12 .item .txt-box {
  padding: 2.5rem;
  position: relative;
}

.responsibility-s12 .item .tit {
  color: #42474e;
}

.responsibility-s12 .item p {
  line-height: 1.6;
  color: #42474e;
  margin-top: 10px;
}

.responsibility-s12 .item:nth-of-type(even) {
  transform: translateY(2.5rem);
}

@media (any-hover: hover) {
  .responsibility-s12 .item:hover img {
    transform: scale(1.1);
  }
}

.responsibility-s12 .swiper-control {
  position: relative;
  width: 33.75rem;
  height: 12px;
  margin: 2.5rem auto 0;
  padding: 4px 2.5rem;
}

.responsibility-s12 .swiper-scrollbar {
  height: 4px;
}

.responsibility-s12 .swiper-scrollbar-drag {
  background-color: #00639d;
}

.responsibility-s12 .button {
  width: 7px;
  height: 12px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  margin-top: -6px;
  cursor: pointer;
  transition: transform .3s ease;
  will-change: transform;
}

.responsibility-s12 .prev {
  left: 0;
  background-image: url("../fonts/prev.svg");
}

@media (any-hover: hover) {
  .responsibility-s12 .prev:hover {
    transform: translateX(-3px);
  }
}

.responsibility-s12 .next {
  right: 0;
  background-image: url("../fonts/next.svg");
}

@media (any-hover: hover) {
  .responsibility-s12 .next:hover {
    transform: translateX(3px);
  }
}

.responsibility-s13 {
  padding-bottom: 11.25rem;
}

.responsibility-s13 .para {
  color: #42474e;
  line-height: 1.6;
  margin-top: 2rem;
}

.responsibility-s13 .block {
  margin-top: 2.5rem;
  position: relative;
}

.responsibility-s13 .center-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 20rem;
  height: 20rem;
  border-radius: 50%;
  background-color: #fff;
  z-index: 2;
}

.responsibility-s13 .center-box:before {
  content: '';
  width: 87.5%;
  height: 87.5%;
  position: absolute;
  top: 6.25%;
  left: 6.25%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/img-13.png");
  animation: o-rotate 20s linear infinite;
}

.responsibility-s13 .center-box:after {
  content: '';
  width: 6.25rem;
  height: 6.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-7.png");
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.responsibility-s13 .items {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  z-index: 1;
}

.responsibility-s13 .item {
  display: inline-block;
  vertical-align: top;
  width: calc((100% - 1.5rem) / 2);
  height: 20rem;
  background-color: #f2f7fa;
  position: relative;
  cursor: pointer;
  overflow: hidden;
  transition: all .3s ease;
}

.responsibility-s13 .item:before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #00639d url("../images/img-9.png") center bottom no-repeat;
  background-size: 100% auto;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.responsibility-s13 .item .box {
  height: 100%;
  position: relative;
  z-index: 2;
}

.responsibility-s13 .item .box:after {
  content: '';
  width: 1.5rem;
  height: 1.5rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-2-2.svg");
  position: absolute;
  top: 3.75rem;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.responsibility-s13 .item span {
  color: #00639d;
  padding: 0 3.75rem;
  position: absolute;
  top: 2.5rem;
  left: 0;
  right: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.responsibility-s13 .item .tit {
  color: #42474e;
  padding: 0 3.75rem;
  position: absolute;
  bottom: 3.75rem;
  left: 0;
  right: 0;
  transition: color .3s ease;
}

.responsibility-s13 .item .text-modal-para {
  display: none;
}

@media screen and (min-width: 769px) {

  .responsibility-s13 .item:nth-of-type(1) .box:after,
  .responsibility-s13 .item:nth-of-type(4) .box:after {
    left: 3.75rem;
  }

  .responsibility-s13 .item:nth-of-type(2),
  .responsibility-s13 .item:nth-of-type(3) {
    margin-left: 1.5rem;
  }

  .responsibility-s13 .item:nth-of-type(2) .box:after,
  .responsibility-s13 .item:nth-of-type(3) .box:after {
    right: 3.75rem;
  }

  .responsibility-s13 .item:nth-of-type(2) span,
  .responsibility-s13 .item:nth-of-type(2) .tit,
  .responsibility-s13 .item:nth-of-type(3) span,
  .responsibility-s13 .item:nth-of-type(3) .tit {
    text-align: right;
  }

  .responsibility-s13 .item:nth-of-type(3),
  .responsibility-s13 .item:nth-of-type(4) {
    margin-top: 1.5rem;
  }

  .responsibility-s13 .item:nth-of-type(3) {
    order: 1;
  }

  .responsibility-s13 .item:nth-of-type(1) {
    border-radius: 10px 0 0 0;
  }

  .responsibility-s13 .item:nth-of-type(2) {
    border-radius: 0 10px 0 0;
  }

  .responsibility-s13 .item:nth-of-type(3) {
    border-radius: 0 0 10px 0;
  }

  .responsibility-s13 .item:nth-of-type(4) {
    border-radius: 0 0 0 10px;
  }
}

@media (any-hover: hover) {
  .responsibility-s13 .item:hover {
    box-shadow: 0 0.625rem 1.875rem rgba(0, 99, 157, 0.3);
  }

  .responsibility-s13 .item:hover:before {
    opacity: 1;
  }

  .responsibility-s13 .item:hover .box:after {
    opacity: 1;
  }

  .responsibility-s13 .item:hover span {
    opacity: 0;
  }

  .responsibility-s13 .item:hover .tit {
    color: #fff;
  }
}

.responsibility-s14 {
  padding: 7.5rem 0;
}

.responsibility-s14 .para {
  color: #42474e;
  line-height: 1.6;
  margin-top: 2rem;
}

.responsibility-s14 .flex {
  margin-top: 2.5rem;
  display: flex;
  align-items: center;
}

.responsibility-s14 .flex .img-box {
  width: 50%;
  border-radius: 10px;
  overflow: hidden;
}

.responsibility-s14 .flex .img-box img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

@media (any-hover: hover) {
  .responsibility-s14 .flex .img-box:hover img {
    transform: scale(1.1);
  }
}

.responsibility-s14 .flex .txt-box {
  width: 50%;
  padding-left: 3.75rem;
}

.responsibility-s14 .flex p {
  color: #42474e;
  line-height: 1.6;
  margin-bottom: 2.5rem;
}

.responsibility-s14 .flex a {
  display: block;
  position: relative;
  border-top: 1px solid #e6e6e6;
  padding: 1.5rem 5rem 1.5rem 2.5rem;
}

.responsibility-s14 .flex a:last-of-type {
  border-bottom: 1px solid #e6e6e6;
}

.responsibility-s14 .flex a:before {
  content: '';
  position: absolute;
  top: 3px;
  right: 0;
  bottom: 3px;
  left: 0;
  background-color: #f2f7fa;
  border-radius: 10px;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.responsibility-s14 .flex a:after {
  content: '';
  width: 1.25rem;
  height: 1.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-8.png");
  position: absolute;
  right: 2.5rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.responsibility-s14 .flex a span {
  display: block;
  line-height: 1.6;
  color: #42474e;
  position: relative;
  z-index: 2;
}

@media (any-hover: hover) {
  .responsibility-s14 .flex a:hover:before {
    opacity: 1;
  }
}

.responsibility-s15 {
  padding: 7.5rem 0;
}

.responsibility-s15 .single {
  display: flex;
  align-items: center;
}

.responsibility-s15 .single.a-middle {
  justify-content: center;
}

.responsibility-s15 .single .img-box {
  width: 50%;
}

.responsibility-s15 .single .img-box img {
  display: block;
  width: 100%;
}

.responsibility-s15 .single .txt-box {
  width: 50%;
}

.responsibility-s15 .single .tit {
  color: #42474e;
}

.responsibility-s15 .single .btns {
  font-size: 0;
  margin-top: 5rem;
}

.responsibility-s15 .single .btns a {
  display: inline-block;
  vertical-align: top;
  width: 12.5rem;
  color: #fff;
  line-height: 3;
  background-color: #00639d;
  text-align: center;
  border-radius: 5px;
  transition: all .3s ease;
}

.responsibility-s15 .single .btns a:nth-of-type(1) {
  margin-right: 10px;
}

@media (any-hover: hover) {
  .responsibility-s15 .single .btns a:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.responsibility-s15 .items {
  margin-top: 7.5rem;
  border-bottom: 1px solid #e6e6e6;
}

.responsibility-s15 .item {
  border-top: 1px solid #e6e6e6;
  padding: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.responsibility-s15 .item span {
  width: calc(100% - 20rem);
  color: #42474e;
}

.responsibility-s15 .item .btns {
  font-size: 0;
}

.responsibility-s15 .item .btns a {
  display: inline-block;
  vertical-align: top;
  width: 7.5rem;
  color: #fff;
  line-height: 3;
  background-color: #00639d;
  text-align: center;
  border-radius: 5px;
  transition: all .3s ease;
}

.responsibility-s15 .item .btns a:nth-of-type(1) {
  margin-right: 10px;
}

@media (any-hover: hover) {
  .responsibility-s15 .item .btns a:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.responsibility-s15 .para {
  color: #42474e;
  line-height: 1.6;
  margin-top: 3.75rem;
}

.career-s1 {
  padding: 7.5rem 0;
}

.career-s1 .c-label .tit {
  color: #42474e;
}

.career-s1 .items {
  margin-top: 3.75rem;
  display: flex;
  flex-wrap: wrap;
}

.career-s1 .item {
  height: 16.3125rem;
  border-radius: 10px;
  overflow: hidden;
  margin-top: 1.5rem;
}

.career-s1 .item .img-box {
  height: 100%;
}

.career-s1 .item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
  will-change: transform;
}

@media screen and (min-width: 769px) {

  .career-s1 .item:nth-of-type(6n),
  .career-s1 .item:nth-of-type(6n-1) {
    width: calc((100% - 1.5rem) / 2);
  }

  .career-s1 .item:nth-of-type(6n-2) {
    width: 100%;
  }

  .career-s1 .item:nth-of-type(6n-3),
  .career-s1 .item:nth-of-type(6n-4),
  .career-s1 .item:nth-of-type(6n-5) {
    width: calc((100% - 3rem) / 3);
  }

  .career-s1 .item:nth-of-type(6n),
  .career-s1 .item:nth-of-type(6n-3),
  .career-s1 .item:nth-of-type(6n-4) {
    margin-left: 1.5rem;
  }

  .career-s1 .item:nth-of-type(1),
  .career-s1 .item:nth-of-type(2),
  .career-s1 .item:nth-of-type(3) {
    margin-top: 0;
  }
}

@media (any-hover: hover) {
  .career-s1 .item:hover img {
    transform: scale(1.1);
  }
}

.career-s2 {
  padding: 7.5rem 0 2.5rem;
  position: relative;
  z-index: 2;
}

.career-s2 .c-label .tit {
  color: #42474e;
}

.career-s2 .filter {
  margin-top: 3.75rem;
  padding: 0 7.5rem;
  font-size: 0;
  position: relative;
  z-index: 2;
}

.career-s2 .filter .year-box {
  display: inline-block;
  vertical-align: top;
  width: 17.5rem;
  margin-right: 1.5rem;
  position: relative;
  z-index: 2;
}

.career-s2 .filter .year-box span {
  display: block;
  border: 1px solid #00639e;
  border-radius: 8px;
  line-height: 52px;
  color: #42474e;
  padding: 0 1.875rem;
  position: relative;
  cursor: pointer;
  z-index: 2;
}

.career-s2 .filter .year-box span:after {
  content: '';
  width: 12px;
  height: 7px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-2.png");
  position: absolute;
  right: 1.875rem;
  top: 50%;
  margin-top: -3px;
}

.career-s2 .filter .year-box .hide {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  background-color: #fff;
  padding: calc(27px + 2rem) 1.875rem 2rem;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  border-radius: 0 0 8px 8px;
  display: none;
}

.career-s2 .filter .year-box .hide a {
  display: inline-block;
  vertical-align: top;
  width: 100%;
  color: #42474e;
  margin-top: 1rem;
}

.career-s2 .filter .year-box .hide a:nth-of-type(1) {
  margin-top: 0;
}

@media (any-hover: hover) {
  .career-s2 .filter .year-box .hide a:hover {
    color: #00639e;
  }
}

.career-s2 .filter .year-box.open .hide {
  display: block;
}

.career-s2 .filter .form {
  display: inline-block;
  vertical-align: top;
  width: calc(100% - 19rem);
  height: 54px;
  background-color: #f2f7fa;
  border-radius: 8px;
  position: relative;
}

.career-s2 .filter .form input {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 1.875rem;
  color: #42474e;
  background-color: transparent;
}

.career-s2 .filter .form button {
  width: 48px;
  height: 48px;
  position: absolute;
  top: 3px;
  right: 3px;
  background-color: #00639d;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../images/icon-1.png");
  background-size: auto 18px;
  border-radius: 8px;
  cursor: pointer;
}

.career-s3 {
  padding: 8.75rem 0 7.5rem;
}

.career-s3 .items {
  margin-top: 2.5rem;
}

.career-s3 .box {
  display: flex;
  flex-wrap: wrap;
}

.career-s3 .item {
  width: calc((100% - 3rem) / 3);
  margin: 1.5rem 1.5rem 0 0;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  transition: all .3s ease;
  background-color: #f2f7fa;
  height: 15rem;
}

.career-s3 .item:before {
  content: '';
  width: 100%;
  height: 100%;
  background: url("../images/img-2.png") center bottom no-repeat;
  background-size: 100% auto;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
  z-index: 1;
}

.career-s3 .item a {
  display: block;
  padding: 3.75rem 2.5rem 2.5rem;
  position: relative;
  z-index: 2;
  transition: transform .3s ease;
  will-change: transform;
}

.career-s3 .item a:after {
  content: '';
  display: block;
  width: 1.375rem;
  height: 1rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-2.svg");
  margin: 1rem auto 0;
}

.career-s3 .item i {
  display: block;
  width: 5.5rem;
  height: 5.5rem;
  margin: 0 auto;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity .3s ease;
  will-change: opacity;
}

.career-s3 .item span {
  display: block;
  color: #42474e;
  margin-top: 1.5rem;
  text-align: center;
  transition: color .3s ease;
}

.career-s3 .item p {
  color: #ffffff;
  line-height: 1.6;
  text-align: center;
  margin-top: 1.25rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

@media screen and (min-width: 769px) {

  .career-s3 .item:nth-of-type(1),
  .career-s3 .item:nth-of-type(2),
  .career-s3 .item:nth-of-type(3) {
    margin-top: 0;
  }

  .career-s3 .item:nth-of-type(3n) {
    margin-right: 0;
  }
}

@media (any-hover: hover) {
  .career-s3 .item:hover {
    background-color: #00639d;
    box-shadow: 0 10px 30px rgba(0, 99, 157, 0.3);
  }

  .career-s3 .item:hover:before {
    opacity: 1;
  }

  .career-s3 .item:hover i {
    opacity: 0;
  }

  .career-s3 .item:hover a {
    transform: translateY(-7rem);
  }

  .career-s3 .item:hover span {
    color: #fff;
  }

  .career-s3 .item:hover p {
    opacity: 1;
  }
}

.career-s4 {
  padding: 3.75rem 0 11.5rem;
}

.career-s4 .items {
  margin-top: 2.5rem;
  overflow: hidden;
}

.career-s4 .swiper {
  padding: 0 calc(50vw - 720px);
}

.career-s4 .swiper-wrapper {
  padding-bottom: 2.5rem;
}

.career-s4 .item {
  width: calc((100% - 4.5rem) / 4);
  height: auto;
  background-color: #f2f7fa;
  border-radius: 10px;
  overflow: hidden;
}

.career-s4 .item .img-box {
  overflow: hidden;
}

.career-s4 .item img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

.career-s4 .item .txt-box {
  padding: 2.5rem;
}

.career-s4 .item .tit {
  color: #42474e;
}

.career-s4 .item p {
  color: #42474e;
  line-height: 1.6;
  margin-top: 10px;
}

.career-s4 .item:nth-of-type(even) {
  transform: translateY(2.5rem);
}

@media (any-hover: hover) {
  .career-s4 .item:hover img {
    transform: scale(1.1);
  }
}

.career-s4 .swiper-control {
  position: relative;
  width: 33.75rem;
  height: 12px;
  margin: 2.5rem auto 0;
  padding: 4px 2.5rem;
}

.career-s4 .swiper-scrollbar {
  height: 4px;
}

.career-s4 .swiper-scrollbar-drag {
  background-color: #00639d;
}

.career-s4 .button {
  width: 7px;
  height: 12px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  margin-top: -6px;
  cursor: pointer;
  transition: transform .3s ease;
  will-change: transform;
}

.career-s4 .prev {
  left: 0;
  background-image: url("../fonts/prev.svg");
}

@media (any-hover: hover) {
  .career-s4 .prev:hover {
    transform: translateX(-3px);
  }
}

.career-s4 .next {
  right: 0;
  background-image: url("../fonts/next.svg");
}

@media (any-hover: hover) {
  .career-s4 .next:hover {
    transform: translateX(3px);
  }
}

.career-s5 {
  padding-bottom: 7.5rem;
  position: relative;
  z-index: 1;
}

.career-s5 .items {
  margin-bottom: 2.5rem;
  border-bottom: 1px solid #e6e6e6;
}

.career-s5 .item {
  border-top: 1px solid #e6e6e6;
  position: relative;
}

.career-s5 .item:before {
  content: '';
  position: absolute;
  width: 100%;
  left: 0;
  top: 10px;
  bottom: 10px;
  background-color: #f2f7fa;
  border-radius: 10px;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.career-s5 .item .box {
  position: relative;
  z-index: 2;
  padding: 3.75rem 15rem 3.75rem 2.5rem;
}

.career-s5 .item .tit {
  color: #42474e;
}

.career-s5 .item .opa {
  display: none;
  opacity: 0;
}

.career-s5 .item .info {
  font-size: 0;
  margin: 1rem 0;
}

.career-s5 .item .info span {
  display: inline-block;
  vertical-align: top;
  color: #42474e;
}

.career-s5 .item .info span:before {
  content: '';
  width: 14px;
  height: 14px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  vertical-align: middle;
  margin: -2px 10px 0 0;
}

.career-s5 .item .info span.addr {
  margin-right: 2.5rem;
}

.career-s5 .item .info span.addr:before {
  background-image: url("../images/icon-3.png");
}

.career-s5 .item .info span.date:before {
  background-image: url("../images/icon-4.png");
}

.career-s5 .item p {
  color: #42474e;
  line-height: 1.5rem;
}

.career-s5 .item a {
  position: absolute;
  top: 2.8125rem;
  right: 2.5rem;
  width: 7.5rem;
  line-height: 3.75rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  color: #fff;
}

@media (any-hover: hover) {
  .career-s5 .item:hover:before {
    opacity: 1;
  }

  .career-s5 .item:hover .opa {
    display: block;
    animation: o-upfade-top 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  }
}

.career-s6 {
  padding: 5rem 0 7.5rem;
}

.career-s6 .label {
  color: #42474e;
}

.career-s6 .info {
  position: relative;
  padding: 3.75rem 0;
  font-size: 0;
  border-bottom: 4px solid #00639d;
}

.career-s6 .info span {
  display: inline-block;
  vertical-align: top;
  color: #42474e;
}

.career-s6 .info span:before {
  content: '';
  width: 14px;
  height: 14px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  vertical-align: middle;
  margin: -2px 10px 0 0;
}

.career-s6 .info span.addr {
  margin-right: 2.5rem;
}

.career-s6 .info span.addr:before {
  background-image: url("../images/icon-3.png");
}

.career-s6 .info span.date:before {
  background-image: url("../images/icon-4.png");
}

.career-s6 .share {
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -24px;
}

.career-s6 .share a {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 48px;
  height: 48px;
  border: 1px solid #eaeced;
  border-radius: 3px;
  margin-left: 10px;
  overflow: hidden;
}

.career-s6 .share a:nth-of-type(1) {
  margin-left: 0;
}

.career-s6 .share a:before {
  content: '';
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  background-color: #00639d;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
}

.career-s6 .share a:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 2;
  transition: all .3s ease;
}

.career-s6 .share a.wechat:after {
  background-image: url("../images/share-1.png");
}

@media (any-hover: hover) {
  .career-s6 .share a.wechat:hover:after {
    background-image: url("../images/share-1-1.png");
  }
}

.career-s6 .share a.fb:after {
  background-image: url("../images/share-2.png");
}

@media (any-hover: hover) {
  .career-s6 .share a.fb:hover:after {
    background-image: url("../images/share-2-1.png");
  }
}

.career-s6 .share a.linkedin:after {
  background-image: url("../images/share-3.png");
}

@media (any-hover: hover) {
  .career-s6 .share a.linkedin:hover:after {
    background-image: url("../images/share-3-1.png");
  }
}

.career-s6 .share a.twi:after {
  background-image: url("../images/share-4.png");
}

@media (any-hover: hover) {
  .career-s6 .share a.twi:hover:after {
    background-image: url("../images/share-4-1.png");
  }
}

@media (any-hover: hover) {
  .career-s6 .share a:hover:before {
    opacity: 1;
  }
}

.career-s6 .item {
  margin-top: 3.75rem;
}

.career-s6 .item .tit {
  padding-bottom: 10px;
  border-bottom: 1px solid #e6e6e6;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
}

.career-s6 .item .tit:after {
  content: '';
  width: 1.25rem;
  height: 1.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../fonts/icon-1-1.svg");
}

.career-s6 .item .tit span {
  max-width: calc(100% - 3.75rem);
  color: #42474e;
}

.career-s6 .item .para {
  margin-top: 2rem;
  color: #42474e;
  line-height: 1.8;
}

.career-s6 .item .para.indent {
  text-indent: 2em;
}

.career-s6 .item.hide .tit:after {
  background-image: url("../fonts/icon-1-2.svg");
}

.career-s6 .tips {
  padding-top: 3.75rem;
  margin-top: 3.75rem;
  color: #42474e;
  line-height: 1.6;
  border-top: 1px solid #e6e6e6;
}

.career-s6 .tips a {
  display: inline-block;
  color: #00639d;
}

.career-s6 a.apply {
  display: block;
  color: #fff;
  line-height: 5rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 10px;
  margin-top: 3.75rem;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .career-s6 a.apply:hover {
    box-shadow: 0 1.25rem 2.5rem rgba(0, 99, 157, 0.3);
    transform: translateY(-3px);
  }
}

.career-s7 {
  padding: 7.5rem 0;
}

.career-s7 .c-label .tit {
  color: #42474e;
}

.career-s7 .items {
  margin-top: 3.75rem;
  display: flex;
}

.career-s7 .item {
  flex: 1;
  height: 30rem;
  margin-left: 1.5rem;
  -webkit-perspective: 800px;
  perspective: 800px;
  cursor: pointer;
}

.career-s7 .item .box {
  position: relative;
  height: 100%;
  will-change: transform;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  transition: transform .5s ease;
}

.career-s7 .item .show {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
  background-color: #f2f7fa;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 2;
}

.career-s7 .item .show:after {
  content: '';
  width: 3rem;
  height: 3rem;
  position: absolute;
  right: 1.75rem;
  bottom: 1.75rem;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../images/icon-5.svg");
  background-size: auto 1.5rem;
  transition: all .3s ease;
}

.career-s7 .item .hide {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 2.5rem;
  border-radius: 10px;
  overflow: hidden;
  background-color: #f2f7fa;
  transform: rotateY(-180deg);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}

.career-s7 .item .hide:after {
  content: '';
  width: 3rem;
  height: 3rem;
  position: absolute;
  right: 1.75rem;
  bottom: 1.75rem;
  background-color: #00639d;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  transform: rotate(45deg);
  background-image: url("../fonts/icon-5-1.svg");
  background-size: auto 1.5rem;
}

.career-s7 .item .img-box {
  overflow: hidden;
}

.career-s7 .item img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

.career-s7 .item .txt-box {
  padding: 2.5rem;
}

.career-s7 .item .tit {
  color: #42474e;
}

.career-s7 .item .para {
  color: #42474e;
  line-height: 1.6;
  margin-top: 1.25rem;
}

.career-s7 .item:nth-of-type(1) {
  margin: 0;
}

@media screen and (min-width: 769px) {
  .career-s7 .item:nth-of-type(even) {
    margin-top: 3.75rem;
  }
}

.career-s7 .item.active .box {
  transform: rotateY(180deg);
}

@media (any-hover: hover) {
  .career-s7 .item:hover img {
    transform: scale(1.1);
  }

  .career-s7 .item:hover .show:after {
    background-color: #00639d;
    background-image: url("../images/icon-5-1.svg");
  }
}

.career-s8 {
  padding: 3.75rem 0 7.5rem;
}

.career-s8 .items {
  margin-top: 2.5rem;
  border-bottom: 1px solid #e6e6e6;
}

.career-s8 .item {
  border-top: 1px solid #e6e6e6;
  position: relative;
}

.career-s8 .item:before {
  content: '';
  position: absolute;
  width: 100%;
  left: 0;
  top: 10px;
  bottom: 10px;
  background-color: #f2f7fa;
  border-radius: 10px;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
}

.career-s8 .item .box {
  position: relative;
  z-index: 2;
}

.career-s8 .item .tit {
  color: #42474e;
  padding: 3.75rem 6.25rem 3.75rem 2.5rem;
  position: relative;
  cursor: pointer;
}

.career-s8 .item .tit:after {
  content: '';
  width: 15px;
  height: 8px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-6.png");
  position: absolute;
  right: 2.5rem;
  top: 50%;
  margin-top: -4px;
  transition: transform .3s ease;
  will-change: transform;
}

.career-s8 .item .para {
  color: #42474e;
  line-height: 1.5rem;
  margin-top: -1.5rem;
  display: none;
  padding: 0 2.5rem 3.75rem;
}

.career-s8 .item.active:before {
  opacity: 1;
}

.career-s8 .item.active .tit:after {
  transform: rotate(180deg);
}

.investor-s1 {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.investor-s1.style-1 {
  padding: 7.5rem 0;
  background-image: url("../images/img-1.jpg");
}

.investor-s1.style-1 .items {
  margin-top: 7.5rem;
}

.investor-s1.style-1 .item p {
  color: #42474e;
}

.investor-s1.style-1 .item .num span {
  color: #00639d;
}

.investor-s1.style-1 .item .num i {
  color: #42474e;
}

.investor-s1.style-2 {
  padding: 11.25rem 0;
  background-image: url("../images/img-5.jpg");
}

.investor-s1.style-2 .item p {
  color: #ffffff;
}

.investor-s1.style-2 .item .num span {
  color: #ffffff;
}

.investor-s1.style-2 .item .num i {
  color: #ffffff;
}

.investor-s1 .para {
  margin-top: 2.5rem;
  color: #42474e;
  line-height: 1.8;
  text-align: center;
}

.investor-s1 .items {
  display: flex;
  justify-content: space-between;
}

.investor-s1 .item {
  width: 15rem;
  text-align: center;
  font-size: 0;
}

.investor-s1 .item .num {
  margin-top: 2.5rem;
  margin-bottom: 10px;
}

.investor-s1 .item .num i {
  font-style: normal;
  margin-left: 5px;
}

.investor-s1 a.more {
  display: block;
  width: 15rem;
  margin: 7.5rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .investor-s1 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.investor-s2 {
  padding: 7.5rem 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../images/img-2.jpg");
}

.investor-s2 .c-label .tit {
  color: #fff;
}

.investor-s2 .cont {
  font-size: 0;
  margin-top: 2.5rem;
  display: flex;
}

.investor-s2 .box {
  display: inline-block;
  vertical-align: middle;
  width: calc(100% - 30.25rem);
  border-radius: 10px;
  background: #fff url("../images/img-3.png") center bottom no-repeat;
  background-size: 100% auto;
  position: relative;
  padding: 2.5rem;
}

.investor-s2 .box span {
  position: absolute;
  top: 2.5rem;
  right: 2.5rem;
  background-color: #00a0e9;
  line-height: 24px;
  color: #fff;
  border-radius: 3px;
  padding: 0 1rem;
}

.investor-s2 .box .img-box {
  position: absolute;
  top: 2.5rem;
  right: 2.5rem;
}

.investor-s2 .box .img-box img {
  display: block;
  height: 2.5rem;
}

.investor-s2 .box .s-tit {
  color: #42474e;
}

.investor-s2 .box .s-tit a {
  color: #42474e;
}

.investor-s2 .box .tit {
  color: #42474e;
  margin-top: 10px;
}

.investor-s2 .box .tit a {
  color: #42474e;
}

.investor-s2 .box .price {
  margin-top: 7.5rem;
  color: #00639d;
}

.investor-s2 .box .stock {
  color: #ff0000;
}

.investor-s2 .box .tip {
  color: #42474e;
  margin-top: 2.5rem;
}

.investor-s2 .link {
  display: inline-block;
  vertical-align: middle;
  width: 28.75rem;
  margin-left: 1.5rem;
}

.investor-s2 .link a {
  display: block;
  position: relative;
  padding: 1.5rem 2.5rem;
  margin-top: -1px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.investor-s2 .link a:last-of-type {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.investor-s2 .link a span {
  display: block;
  color: #fff;
  position: relative;
  padding-right: 2.5rem;
}

.investor-s2 .link a span:after {
  content: '';
  width: 1.375rem;
  height: 1rem;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-1-1.svg");
  transition: all .3s ease;
}

.investor-s2 .link a:before,
.investor-s2 .link a:after {
  content: '';
  width: 100%;
  height: 1px;
  background-color: #00a0e9;
  position: absolute;
  left: 0;
  transform: scaleX(0);
}

.investor-s2 .link a:before {
  top: 0;
  transform-origin: left top;
}

.investor-s2 .link a:after {
  bottom: 0;
  transform-origin: right top;
}

@media (any-hover: hover) {

  .investor-s2 .link a:hover:before,
  .investor-s2 .link a:hover:after {
    transform: scaleX(1);
    transition: transform .5s ease;
  }
}

.investor-s2 .n-box {
  width: 28.75rem;
  margin-left: 1.5rem;
  border-radius: 10px;
  background: #fff url("../images/img-3-1.png") center bottom no-repeat;
  background-size: 100% auto;
  padding: 2.5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: space-between;
}

.investor-s2 .n-box .img-box {
  width: 13.25rem;
}

.investor-s2 .n-box .img-box img {
  display: block;
  width: 100%;
}

.investor-s2 .n-box span {
  color: #42474e;
}

.investor-s2 .n-box a {
  display: block;
  width: 15rem;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .investor-s2 .n-box a:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.investor-s2 .n-box-1 {
  width: 28.75rem;
  margin-left: 1.5rem;
  border-radius: 10px;
  background: #fff url("../images/img-3-1.png") center bottom no-repeat;
  background-size: 100% auto;
  padding: 2.5rem;
}

.investor-s2 .n-box-1 .tit {
  color: #42474e;
}

.investor-s2 .n-box-1 .tit:after {
  content: '';
  width: 3.75rem;
  height: 1px;
  background-color: #00a0e9;
  display: block;
  margin-top: 1.5rem;
}

.investor-s2 .n-box-1 .para {
  margin-top: 1.5rem;
  line-height: 1.6;
  color: #42474e;
}

.investor-s2 .n-box-1 .para a {
  color: #00639d;
  display: inline-block;
}

.investor-s3 {
  padding: 7.5rem 0;
}

.investor-s3 .items {
  margin-top: 2.5rem;
  position: relative;
}

.investor-s3 .item {
  height: auto;
  background-color: #f2f7fa;
  border-radius: 10px;
}

.investor-s3 .item a {
  display: block;
  height: 100%;
  padding: 2.5rem;
}

.investor-s3 .item .date span,
.investor-s3 .item .date i {
  display: block;
}

.investor-s3 .item .date span {
  color: #42474e;
}

.investor-s3 .item .date i {
  font-style: normal;
  color: #42474e;
}

.investor-s3 .item .tit {
  color: #42474e;
  line-height: 2rem;
  height: 4rem;
  margin-top: 6.25rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.investor-s3 .item p {
  color: #42474e;
  line-height: 1.6;
  margin-top: 10px;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.investor-s3 .button {
  width: 3rem;
  height: 3rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  margin-top: -1.5rem;
  cursor: pointer;
}

.investor-s3 .prev {
  left: -11.25rem;
  background-image: url("../fonts/left-1.svg");
}

.investor-s3 .next {
  right: -11.25rem;
  background-image: url("../fonts/right-1.svg");
}

.investor-s3 a.more {
  display: block;
  width: 15rem;
  margin: 2.5rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .investor-s3 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.investor-s4 {
  padding: 3.75rem 0 7.5rem;
}

.investor-s4 .items {
  margin-top: 2.5rem;
  display: flex;
}

.investor-s4 .item {
  flex: 1;
  padding: 0 4.375rem;
}

.investor-s4 .item a {
  display: block;
}

.investor-s4 .item img {
  display: block;
  width: 100%;
}

.investor-s4 .item span {
  display: block;
  text-align: center;
  color: #42474e;
  margin-top: 1.5rem;
  transition: color .3s ease;
}

.investor-s4 .item:nth-of-type(2) {
  border-left: 1px solid #e6e6e6;
}

@media (any-hover: hover) {
  .investor-s4 .item:hover span {
    color: #00639d;
  }
}

.investor-s4 a.more {
  display: block;
  width: 15rem;
  margin: 2.5rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .investor-s4 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.investor-s5 {
  padding: 7.5rem 0;
}

.investor-s5 .para {
  color: #42474e;
  line-height: 1.8;
  text-align: justify;
}

.investor-s6 {
  padding: 5.625rem 0 7.5rem;
}

.investor-s6 .link {
  font-size: 0;
  text-align: center;
  margin-bottom: 2.5rem;
}

.investor-s6 .link a {
  display: inline-block;
  vertical-align: top;
  width: 15rem;
  line-height: calc(3.375rem - 2px);
  border-radius: 5px;
  border: 1px solid #e6e6e6;
  color: #42474e;
  margin-left: 1.5rem;
  transition: all .3s ease;
}

.investor-s6 .link a:nth-of-type(1) {
  margin-left: 0;
}

.investor-s6 .link a.active {
  background-color: #00639d;
  color: #fff;
  border-color: #00639d;
}

@media (any-hover: hover) {
  .investor-s6 .link a:hover {
    background-color: #00639d;
    color: #fff;
    border-color: #00639d;
  }
}

.investor-s6 .items {
  margin-bottom: 2.5rem;
}

.investor-s6 .item {
  border-top: 1px solid #e6e6e6;
  position: relative;
}

.investor-s6 .item:before,
.investor-s6 .item:after {
  content: '';
  width: 100%;
  height: 1px;
  background-color: #00639d;
  position: absolute;
  left: 0;
  transform: scaleX(0);
}

.investor-s6 .item:before {
  top: 0;
  transform-origin: left top;
}

.investor-s6 .item:after {
  bottom: 0;
  transform-origin: right top;
}

.investor-s6 .item a {
  display: flex;
  align-items: flex-start;
  padding: 2.5rem;
}

.investor-s6 .item .date {
  width: 16.25rem;
}

.investor-s6 .item .date span,
.investor-s6 .item .date i {
  display: block;
}

.investor-s6 .item .date span {
  color: #42474e;
}

.investor-s6 .item .date i {
  font-style: normal;
  color: #42474e;
}

.investor-s6 .item .txt-box {
  width: calc(100% - 16.25rem);
}

.investor-s6 .item .tit {
  color: #42474e;
}

.investor-s6 .item .s-date {
  color: #00639d;
  margin-top: 1.5rem;
}

.investor-s6 .item p {
  color: #42474e;
  line-height: 1.6;
  margin-top: 1.5rem;
  text-align: justify;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.investor-s6 .item.nop a {
  align-items: center;
}

.investor-s6 .item:last-of-type {
  border-bottom: 1px solid #e6e6e6;
}

@media (any-hover: hover) {

  .investor-s6 .item:hover:before,
  .investor-s6 .item:hover:after {
    transform: scaleX(1);
    transition: transform .5s ease;
  }
}

.investor-s7 {
  padding: 7.5rem 0;
}

.investor-s7 .item {
  border-bottom: 1px solid #e6e6e6;
  position: relative;
  padding: 1.5rem 0;
}

.investor-s7 .item:before {
  content: '';
  width: 100%;
  height: 1px;
  background-color: #00639d;
  position: absolute;
  left: 0;
  transform: scaleX(0);
}

.investor-s7 .item:before {
  bottom: 0;
  transform-origin: left top;
}

.investor-s7 .item .img-box {
  width: 50%;
}

.investor-s7 .item .img-box img {
  display: block;
  width: 100%;
}

.investor-s7 .item .txt-box {
  width: 50%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.investor-s7 .item .tit {
  color: #42474e;
  transition: color .3s ease;
}

.investor-s7 .item .btns {
  margin-top: 3.75rem;
  font-size: 0;
}

.investor-s7 .item .btns a {
  display: inline-block;
  vertical-align: top;
  width: 12.5rem;
  line-height: 3.375rem;
  text-align: center;
  color: #fff;
  background-color: #00639d;
  border-radius: 5px;
  transition: all .3s ease;
}

.investor-s7 .item .btns a:nth-of-type(2) {
  margin-left: 10px;
}

@media (any-hover: hover) {
  .investor-s7 .item .btns a:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

@media screen and (min-width: 769px) {
  .investor-s7 .item:nth-of-type(odd) .txt-box {
    right: 0;
  }

  .investor-s7 .item:nth-of-type(even) .img-box {
    margin-left: 50%;
  }

  .investor-s7 .item:nth-of-type(even) .txt-box {
    left: 0;
    padding-left: 7.5rem;
  }
}

@media (any-hover: hover) {
  .investor-s7 .item:hover:before {
    transform: scaleX(1);
    transition: transform .5s ease;
  }

  .investor-s7 .item:hover .tit {
    color: #00639d;
  }
}

.investor-s8 {
  padding: 7.5rem 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../images/img-7.jpg");
}

.investor-s8 .c-label .tit {
  color: #fff;
}

.investor-s8 .para {
  color: #fff;
  line-height: 1.8;
  text-align: justify;
  margin-top: 2.5rem;
  height: 216px;
  overflow: hidden;
}

.investor-s8 .para.open {
  height: auto !important;
}

.investor-s8 span.loadmore {
  display: block;
  width: 24px;
  height: 24px;
  margin: 2.5rem auto 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-2-2.svg");
  cursor: pointer;
}

.investor-s8 span.loadmore.open {
  background-image: url("../images/icon-2-1.svg");
}

.investor-s9 {
  padding-bottom: 7.5rem;
  background: url("../images/img-8.jpg") center bottom no-repeat;
  background-size: 100% auto;
}

.investor-s9 .para {
  margin-top: 2.5rem;
  color: #42474e;
  text-align: center;
}

.investor-s9 .para a {
  display: inline-block;
  color: #00639d;
}

.investor-s10 {
  padding: 7.5rem 0;
}

.investor-s10 .para {
  line-height: 1.8;
  color: #42474e;
  text-align: justify;
}

.investor-s10 table {
  width: 100%;
  margin-top: 2.5rem;
  border: 1px solid #e6e6e6;
}

.investor-s10 table td {
  color: #42474e;
  padding: 1.5rem;
}

.investor-s10 table td a {
  color: #00639d;
  display: inline-block;
  margin-left: 5rem;
}

@media screen and (min-width: 769px) {
  .investor-s10 table td:nth-of-type(1) {
    width: 23.75rem;
  }

  .investor-s10 table td:nth-of-type(2) {
    width: 17.5rem;
  }
}

.investor-s11 {
  padding: 7.5rem 0;
}

.investor-s11 .label {
  color: #42474e;
}

.investor-s11 .items {
  margin-top: 3.75rem;
  display: flex;
}

.investor-s11 .item {
  flex: 1;
}

.investor-s11 .item .tit {
  color: #00639d;
  padding-left: 1.25rem;
  border-left: 4px solid #00639d;
}

.investor-s11 .item .info {
  border: 1px solid #e6e6e6;
  margin-top: 1rem;
  padding: 2.5rem 2.5rem 3.75rem;
}

.investor-s11 .item .info span {
  display: block;
  color: #42474e;
}

.investor-s11 .item .info .para {
  margin-top: 2rem;
  color: #42474e;
  line-height: 2;
}

.investor-s11 .item:nth-of-type(2) {
  margin-left: 1.5rem;
}

.investor-s12 {
  padding: 7.5rem 0;
}

.investor-s12 .items {
  margin-top: 2.5rem;
  position: relative;
  font-size: 0;
}

.investor-s12 .item {
  display: inline-block;
  vertical-align: top;
  width: calc((100% - 3rem) / 2);
  background-color: #f2f7fa;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
  transition: all .3s ease;
}

.investor-s12 .item:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../images/img-9.png") center top no-repeat;
  background-size: 100% auto;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
}

.investor-s12 .item a {
  display: block;
  height: 22.5rem;
  padding: 2.5rem;
  position: relative;
  z-index: 2;
}

.investor-s12 .item .date:after {
  content: '';
  width: 1.5rem;
  height: 4px;
  background-color: #00639d;
  display: block;
  margin-top: 1rem;
}

.investor-s12 .item .date span,
.investor-s12 .item .date i {
  display: block;
  transition: color .3s ease;
}

.investor-s12 .item .date span {
  color: #42474e;
}

.investor-s12 .item .date i {
  font-style: normal;
  color: #42474e;
}

.investor-s12 .item .tit {
  color: #42474e;
  margin-top: 6.25rem;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0 2.5rem 2.5rem;
  transition: color .3s ease;
}

.investor-s12 .item:nth-of-type(2) {
  margin-left: 3rem;
}

@media (any-hover: hover) {
  .investor-s12 .item:hover {
    background-color: #00639d;
    box-shadow: 0 0.625rem 1.875rem rgba(0, 99, 157, 0.3);
  }

  .investor-s12 .item:hover:before {
    opacity: 1;
  }

  .investor-s12 .item:hover .date span,
  .investor-s12 .item:hover .date i {
    color: #fff;
  }

  .investor-s12 .item:hover .date:after {
    background-color: #00a0e9;
  }

  .investor-s12 .item:hover .tit {
    color: #fff;
  }
}

.investor-s12 a.more {
  display: block;
  width: 15rem;
  margin: 2.5rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .investor-s12 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.media-s1 {
  padding: 5.625rem 0 7.5rem;
}

.media-s1 .filter {
  padding: 0 7.5rem;
  font-size: 0;
  position: relative;
  z-index: 2;
}

.media-s1 .filter .form {
  display: inline-block;
  vertical-align: top;
  width: calc(100% - 19rem);
  height: 54px;
  background-color: #f2f7fa;
  border-radius: 8px;
  position: relative;
}

.media-s1 .filter .form input {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 1.875rem;
  color: #42474e;
  background-color: transparent;
}

.media-s1 .filter .form button {
  width: 48px;
  height: 48px;
  position: absolute;
  top: 3px;
  right: 3px;
  background-color: #00639d;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../images/icon-1.png");
  background-size: auto 18px;
  border-radius: 8px;
  cursor: pointer;
}

.media-s1 .filter .year-box {
  display: inline-block;
  vertical-align: top;
  width: 17.5rem;
  margin-left: 1.5rem;
  position: relative;
}

.media-s1 .filter .year-box span {
  display: block;
  border: 1px solid #00639e;
  border-radius: 8px;
  line-height: 52px;
  color: #42474e;
  padding: 0 1.875rem;
  position: relative;
  cursor: pointer;
  z-index: 2;
}

.media-s1 .filter .year-box span:after {
  content: '';
  width: 12px;
  height: 7px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-2.png");
  position: absolute;
  right: 1.875rem;
  top: 50%;
  margin-top: -3px;
}

.media-s1 .filter .year-box .hide {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  background-color: #fff;
  padding: calc(27px + 2rem) 1.875rem 2rem;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  border-radius: 0 0 8px 8px;
  display: none;
}

.media-s1 .filter .year-box .hide a {
  display: inline-block;
  vertical-align: top;
  width: 25%;
  color: #42474e;
  text-align: center;
}

@media (any-hover: hover) {
  .media-s1 .filter .year-box .hide a:hover {
    color: #00639e;
  }
}

.media-s1 .filter .year-box.open .hide {
  display: block;
}

.media-s1 .items {
  margin: 2.5rem 0;
  display: flex;
  flex-wrap: wrap;
}

.media-s1 .item {
  position: relative;
  width: calc((100% - 3.75rem) / 2);
  border-bottom: 1px solid #e6e6e6;
}

.media-s1 .item:before {
  content: '';
  width: 100%;
  height: 1px;
  background-color: #00639e;
  position: absolute;
  left: 0;
  top: -1px;
  transform: scaleX(0);
  transform-origin: left top;
  will-change: transform;
}

.media-s1 .item a {
  display: flex;
  align-items: flex-start;
  padding: 2.5rem 0;
}

.media-s1 .item .img-box {
  width: calc(50% - 1.25rem);
  border-radius: 10px;
  overflow: hidden;
}

.media-s1 .item img {
  display: block;
  width: 100%;
  height: 11.25rem;
  object-fit: cover;
  transition: transform .5s ease;
  will-change: transform;
}

.media-s1 .item .txt-box {
  width: calc(50% + 1.25rem);
  padding-left: 2.5rem;
}

.media-s1 .item .date {
  color: #42474e;
}

.media-s1 .item .tit {
  line-height: 1.6;
  color: #42474e;
  margin-top: 1.5rem;
  transition: color .3s ease;
}

.media-s1 .item p {
  line-height: 1.6;
  color: #42474e;
  margin-top: 1.5rem;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  display: none;
}

@media screen and (min-width: 769px) {
  .media-s1 .item:nth-of-type(even) {
    margin-left: 3.75rem;
  }

  .media-s1 .item:nth-of-type(1),
  .media-s1 .item:nth-of-type(2) {
    border-top: 1px solid #e6e6e6;
  }
}

@media (any-hover: hover) {
  .media-s1 .item:hover:before {
    transform: scaleX(1);
    transition: transform .5s ease;
  }

  .media-s1 .item:hover img {
    transform: scale(1.1);
  }

  .media-s1 .item:hover .tit {
    color: #00639d;
  }
}

.media-s2 {
  padding: 5rem 0 7.5rem;
}

.media-s2 .top-block .tit {
  color: #42474e;
}

.media-s2 .top-block .date {
  color: #00639d;
  margin-top: 2.5rem;
}

.media-s2 .top-block .date:before {
  content: '';
  width: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: middle;
  margin: -2px 10px 0 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-3.png");
}

.media-s2 .top-block .para {
  text-align: justify;
}

.media-s2 .top-block .para p {
  margin-top: 1.5rem;
}

.media-s2 .top-block .para p:nth-of-type(1) {
  margin-top: 0;
}

.media-s2 .share {
  position: relative;
  padding: 2.5rem 0;
  text-align: center;
  font-size: 0;
}

.media-s2 .share:before {
  content: '';
  width: 100%;
  height: 4px;
  position: absolute;
  left: 0;
  top: calc(50% - 2px);
  background-color: #00639d;
  z-index: 1;
}

.media-s2 .share .box {
  padding: 0 2.5rem;
  background-color: #fff;
  display: inline-block;
  vertical-align: top;
  position: relative;
  z-index: 2;
}

.media-s2 .share a {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 48px;
  height: 48px;
  border: 1px solid #eaeced;
  border-radius: 3px;
  margin-left: 10px;
  overflow: hidden;
}

.media-s2 .share a:nth-of-type(1) {
  margin-left: 0;
}

.media-s2 .share a:before {
  content: '';
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  background-color: #00639d;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
}

.media-s2 .share a:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 2;
  transition: all .3s ease;
}

.media-s2 .share a.wechat:after {
  background-image: url("../images/share-1.png");
}

@media (any-hover: hover) {
  .media-s2 .share a.wechat:hover:after {
    background-image: url("../images/share-1-1.png");
  }
}

.media-s2 .share a.fb:after {
  background-image: url("../images/share-2.png");
}

@media (any-hover: hover) {
  .media-s2 .share a.fb:hover:after {
    background-image: url("../images/share-2-1.png");
  }
}

.media-s2 .share a.linkedin:after {
  background-image: url("../images/share-3.png");
}

@media (any-hover: hover) {
  .media-s2 .share a.linkedin:hover:after {
    background-image: url("../images/share-3-1.png");
  }
}

.media-s2 .share a.twi:after {
  background-image: url("../images/share-4.png");
}

@media (any-hover: hover) {
  .media-s2 .share a.twi:hover:after {
    background-image: url("../images/share-4-1.png");
  }
}

@media (any-hover: hover) {
  .media-s2 .share a:hover:before {
    opacity: 1;
  }
}

.media-s2 .bot-block {
  margin-top: 5rem;
}

.media-s2 .bot-block .items {
  display: flex;
  margin-top: 1.5rem;
}

.media-s2 .bot-block .item {
  flex: 1;
  margin-left: 1.5rem;
}

.media-s2 .bot-block .item:nth-of-type(1) {
  margin: 0;
}

.media-s2 .bot-block .item .img-box {
  border-radius: 12px;
  overflow: hidden;
}

.media-s2 .bot-block .item img {
  display: block;
  width: 100%;
  height: 16.3125rem;
  object-fit: cover;
  transition: transform .5s ease;
  will-change: transform;
}

.media-s2 .bot-block .item .txt-box {
  padding: 2.5rem 2.5rem 0;
}

.media-s2 .bot-block .item .tit {
  color: #42474e;
  line-height: 1.6;
}

@media (any-hover: hover) {
  .media-s2 .bot-block .item:hover img {
    transform: scale(1.1);
  }
}

.media-s3 {
  padding: 3.75rem 0;
  border-bottom: 1px solid #e6e6e6;
}

.media-s3 .flex {
  display: flex;
}

.media-s3 a {
  flex: 1;
  margin-left: 1.5rem;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  padding: 1.875rem;
  position: relative;
}

.media-s3 a:after {
  content: '';
  width: 100%;
  height: 4px;
  background-color: #00639d;
  position: absolute;
  bottom: 0;
  left: 0;
  transform: scaleX(0);
  transform-origin: left top;
}

.media-s3 a i {
  display: block;
  width: 4.125rem;
  height: 4.125rem;
  margin: 0 auto;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.media-s3 a span {
  display: block;
  color: #42474e;
  text-align: center;
}

.media-s3 a:nth-of-type(1) {
  margin-left: 0;
}

.media-s3 a.active:after {
  transform: scaleX(1);
}

@media (any-hover: hover) {
  .media-s3 a:hover:after {
    transform: scaleX(1);
    transition: transform .5s ease;
  }
}

.media-s4 {
  padding: 3.75rem 0 7.5rem;
}

.media-s4 .flex {
  display: flex;
  border-radius: 10px;
  overflow: hidden;
}

.media-s4 .img-box {
  width: 66.66%;
}

.media-s4 .img-box img {
  display: block;
  width: 100%;
}

.media-s4 .txt-box {
  width: 33.34%;
  background: #00639d url("../images/img-5.png") center bottom no-repeat;
  background-size: 100% auto;
  text-align: center;
}

.media-s4 .txt-box span {
  display: block;
  color: #fff;
}

.media-s4 .txt-box a {
  display: inline-block;
  color: #fff;
  margin-top: 5.625rem;
}

.media-s4 .txt-box a:before {
  content: '';
  width: 1.375rem;
  height: 1.875rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-5.png");
  display: inline-block;
  vertical-align: middle;
  margin: -2px 10px 0 0;
}

.media-s4 .para {
  padding: 3.75rem 7.5rem 0;
  color: #42474e;
  line-height: 1.6;
  text-align: justify;
}

.media-s5 {
  padding: 3.75rem 0 7.5rem;
}

.media-s5 .items {
  display: flex;
  flex-wrap: wrap;
}

.media-s5 .item {
  display: block;
  width: calc((100% - 1.5rem) / 2);
  height: 25rem;
  margin: 1.5rem 1.5rem 0 0;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
}

.media-s5 .item:nth-of-type(1) {
  background-color: #f2f7fa;
}

.media-s5 .item:nth-of-type(2) {
  background-color: #00639d;
}

.media-s5 .item:nth-of-type(3) {
  background-color: #f2f7fa;
}

.media-s5 .item:nth-of-type(4) {
  background-color: #00639d;
}

.media-s5 .item .cell-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
}

.media-s5 .item .show {
  z-index: 1;
}

.media-s5 .item .show img {
  width: 15.25rem;
}

.media-s5 .item .hide {
  background-color: rgba(0, 99, 157, 0.95);
  opacity: 0;
  transition: opacity .3s ease;
  will-change: opacity;
  z-index: 2;
}

.media-s5 .item .tit {
  color: #fff;
}

@media screen and (min-width: 769px) {

  .media-s5 .item:nth-of-type(1),
  .media-s5 .item:nth-of-type(2) {
    margin-top: 0;
  }

  .media-s5 .item:nth-of-type(even) {
    margin-right: 0;
  }
}

.media-s5 .item span {
  display: block;
  margin-top: 1rem;
  color: #fff;
}

@media (any-hover: hover) {
  .media-s5 .item:hover .hide {
    opacity: 1;
  }
}

.media-s5 .para {
  padding: 3.75rem 7.5rem 0;
  color: #42474e;
  line-height: 1.6;
  text-align: justify;
}

.media-s6 {
  padding: 3.75rem 0 7.5rem;
}

.media-s6 .items {
  display: flex;
  flex-wrap: wrap;
}

.media-s6 .item {
  width: calc((100% - 3rem) / 3);
  margin: 1.5rem 1.5rem 0 0;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

.media-s6 .item .img-box {
  position: relative;
  height: 100%;
  overflow: hidden;
  z-index: 1;
}

.media-s6 .item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
  will-change: transform;
}

.media-s6 .item .hide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 99, 157, 0.9);
  opacity: 0;
  transition: opacity .3s ease;
  z-index: 2;
  will-change: opacity;
}

.media-s6 .item .hide:before {
  content: '';
  width: 2.25rem;
  height: 2.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-6.png");
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.media-s6 .item .hide span {
  position: absolute;
  bottom: 1.5rem;
  left: 0;
  right: 0;
  text-align: center;
  color: #fff;
}

@media screen and (min-width: 769px) {

  .media-s6 .item:nth-of-type(1),
  .media-s6 .item:nth-of-type(2),
  .media-s6 .item:nth-of-type(3) {
    margin-top: 0;
  }

  .media-s6 .item:nth-of-type(3n) {
    margin-right: 0;
  }
}

@media (any-hover: hover) {
  .media-s6 .item:hover img {
    transform: scale(1.1);
  }

  .media-s6 .item:hover .hide {
    opacity: 1;
  }
}

.media-s6 .para {
  padding: 3.75rem 7.5rem 0;
  color: #42474e;
  line-height: 1.6;
  text-align: justify;
}

.media-s7 {
  padding: 3.75rem 0 7.5rem;
}

.media-s7 .link {
  font-size: 0;
  text-align: center;
  margin-bottom: 2.5rem;
}

.media-s7 .link a {
  display: inline-block;
  vertical-align: top;
  width: 15rem;
  line-height: calc(3.375rem - 2px);
  border-radius: 5px;
  border: 1px solid #e6e6e6;
  color: #42474e;
  margin-left: 1.5rem;
  transition: all .3s ease;
}

.media-s7 .link a:nth-of-type(1) {
  margin-left: 0;
}

.media-s7 .link a.active {
  background-color: #00639d;
  color: #fff;
  border-color: #00639d;
}

@media (any-hover: hover) {
  .media-s7 .link a:hover {
    background-color: #00639d;
    color: #fff;
    border-color: #00639d;
  }
}

.media-s7 .items {
  display: flex;
  flex-wrap: wrap;
}

.media-s7 .item {
  width: calc((100% - 3rem) / 3);
  margin: 1.5rem 1.5rem 0 0;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  background-color: #f2f7fa;
  cursor: pointer;
}

.media-s7 .item .top-box {
  position: relative;
}

.media-s7 .item .top-box:after {
  content: '';
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  transition: opacity .3s ease;
}

.media-s7 .item .top-box span {
  line-height: 24px;
  color: #fff;
  background-color: #00a0e9;
  padding: 0 10px;
  border-radius: 3px;
  position: absolute;
  top: 1.875rem;
  left: 1.875rem;
  z-index: 3;
}

.media-s7 .item .img-box {
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.media-s7 .item img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

.media-s7 .item .bot-box {
  padding: 2.5rem;
}

.media-s7 .item .tit {
  color: #42474e;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.media-s7 .item .date {
  margin-top: 1.25rem;
  color: #42474e;
  display: none;
}

@media screen and (min-width: 769px) {

  .media-s7 .item:nth-of-type(1),
  .media-s7 .item:nth-of-type(2),
  .media-s7 .item:nth-of-type(3) {
    margin-top: 0;
  }

  .media-s7 .item:nth-of-type(3n) {
    margin-right: 0;
  }
}

@media (any-hover: hover) {
  .media-s7 .item:hover .top-box:after {
    opacity: 0;
  }

  .media-s7 .item:hover img {
    transform: scale(1.1);
  }
}

.media-s7 .para {
  padding: 3.75rem 7.5rem 0;
  color: #42474e;
  line-height: 1.6;
  text-align: justify;
}

.portfolio-s1 {
  padding: 7.5rem 0;
}

.portfolio-s1 .c-label .tit {
  color: #42474e;
}

.portfolio-s1 .img-box {
  width: 30rem;
  margin: 2.5rem auto 0;
  border-radius: 10px;
  overflow: hidden;
  display: none;
}

.portfolio-s1 .img-box img {
  display: block;
  width: 100%;
}

.portfolio-s1 .item {
  margin-top: 2.5rem;
}

.portfolio-s1 .item .para {
  color: #0f1e34;
  line-height: 1.6;
  text-align: justify;
}

.portfolio-s1 .item .para img {
  max-width: 100%;
  height: auto !important;
}

.portfolio-s1 .item .para span {
  display: block;
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  color: #0f1e34;
}

.portfolio-s1 .item .para a {
  display: inline-block;
  color: #00639d;
}

.portfolio-s1 .item.hide .tit:after {
  background-image: url("../images/icon-1-2.svg");
}

.portfolio-s2 {
  padding: 7.5rem 0;
}

.portfolio-s2 .c-label .tit {
  color: #42474e;
}

.portfolio-s2 .cont {
  margin-top: 5rem;
}

.portfolio-s2 .table .top-box {
  height: 5rem;
  display: flex;
  align-items: center;
  padding: 0 2.5rem;
  font-size: 0;
  background-image: linear-gradient(180deg, #009ce5, #00639d);
  border-radius: 2.5rem;
  box-shadow: 0 0.625rem 1.875rem rgba(0, 99, 157, 0.3);
}

.portfolio-s2 .table .top-box .flex {
  width: calc(100% - 35rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.portfolio-s2 .table .top-box i,
.portfolio-s2 .table .top-box span {
  color: #fff;
}

.portfolio-s2 .table .top-box i {
  font-style: normal;
}

.portfolio-s2 .table .top-box i:nth-of-type(1) {
  width: 18rem;
}

.portfolio-s2 .table .top-box i:nth-of-type(2) {
  width: 17rem;
}

.portfolio-s2 .table .bot-box {
  margin-top: 10px;
}

.portfolio-s2 .table .box {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 5.625rem;
  padding-left: 18rem;
  margin-top: 10px;
  background-color: #fff;
  border-radius: 2.8125rem;
  box-shadow: 0 1.875rem 1.875rem rgba(0, 99, 157, 0.05);
}

.portfolio-s2 .table .box:nth-of-type(1) {
  margin-top: 0;
}

.portfolio-s2 .table .box .cate {
  position: absolute;
  left: 0;
  top: 0;
  width: 18rem;
  height: 100%;
  background-image: linear-gradient(180deg, #8bd1f9, #0070ad);
  border-radius: 2.8125rem;
  padding: 4px;
}

.portfolio-s2 .table .box .cate:before {
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  right: 4px;
  bottom: 4px;
  border: 1px dashed #fff;
  opacity: 0.6;
  border-radius: 2.5rem;
}

.portfolio-s2 .table .box .cate .cell-box {
  height: 100%;
  padding: 0 1.5rem;
}

.portfolio-s2 .table .box .cate span {
  color: #fff;
}

.portfolio-s2 .table .box .cate span i {
  font-style: normal;
}

.portfolio-s2 .table .items {
  padding: 10px 0 10px 2.5rem;
  width: 100%;
}

.portfolio-s2 .table .item {
  margin-top: 1rem;
  display: flex;
  align-items: center;
}

.portfolio-s2 .table .item:nth-of-type(1) {
  margin-top: 0;
}

.portfolio-s2 .table .item span {
  width: 17rem;
  color: #42474e;
}

.portfolio-s2 .table .item .line {
  width: calc(100% - 19.5rem);
}

.portfolio-s2 .table .item .ani {
  display: block;
  height: 1.25rem;
  border-radius: .625rem;
  background-image: linear-gradient(90deg, #ecf3f7, #3885b3);
  overflow: hidden;
  position: relative;
  transform: scaleX(0);
  transform-origin: left center;
}

.portfolio-s2 .table .item .ani:before {
  content: '';
  width: calc(100% - 10px - 1rem);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url("../images/img-2.png") center left repeat-x;
}

.portfolio-s2 .table .item .ani:after {
  content: '';
  width: 1rem;
  height: 1rem;
  border: 2px solid #fff;
  border-radius: 50%;
  box-sizing: border-box;
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%) scale(0.75);
  transform-origin: right center;
}

.portfolio-s2 .table .item.active .ani {
  transform: scaleX(1);
  transition: transform 1s .2s ease;
}

.portfolio-s3 {
  padding: 7.5rem 0;
}

.portfolio-s3 .item .tit {
  border-bottom: 1px solid #e6e6e6;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

.portfolio-s3 .item .tit:after {
  content: '';
  width: 1.25rem;
  height: 1.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-1-2.svg");
}

.portfolio-s3 .item .tit span {
  max-width: calc(100% - 3.75rem);
  line-height: 5rem;
  color: #42474e;
  transform: scale(0.66);
  transform-origin: left center;
}

.portfolio-s3 .item .para {
  padding: 2.5rem 0;
  color: #42474e;
  line-height: 1.8;
  border-bottom: 1px solid #e6e6e6;
  text-align: justify;
  display: none;
}

.portfolio-s3 .item .para a {
  display: block;
  color: #00639d;
}

.portfolio-s3 .item.active .tit:after {
  background-image: url("../images/icon-1-1.svg");
}

.portfolio-s3 .item.active .tit span {
  transform: scale(1);
}

.portfolio-s3 .item.active .para {
  display: block;
}

.portfolio-s4 {
  padding: 7.5rem 0;
}

.portfolio-s4 .c-label .tit {
  color: #42474e;
  text-align: left;
}

.portfolio-s4 .item {
  margin-top: 5.625rem;
}

.portfolio-s4 .item:nth-of-type(1) {
  margin-top: 0;
}

.portfolio-s4 .item:nth-of-type(1) .table {
  border-color: #00639d;
}

.portfolio-s4 .item:nth-of-type(1) .table .top-box {
  background-color: #00639d;
}

.portfolio-s4 .item:nth-of-type(1) .table .bot-box:before {
  background-color: #f2f7fa;
}

.portfolio-s4 .item:nth-of-type(2) .table {
  border-color: #143359;
}

.portfolio-s4 .item:nth-of-type(2) .table .top-box {
  background-color: #143359;
}

.portfolio-s4 .item:nth-of-type(2) .table .bot-box:before {
  background-color: #f3f5f7;
}

.portfolio-s4 .cont {
  margin-top: 1.25rem;
}

.portfolio-s4 .table {
  border-radius: 10px;
  border: 1px solid transparent;
  overflow: hidden;
  margin-top: 1rem;
}

.portfolio-s4 .table:nth-of-type(1) {
  margin-top: 0;
}

.portfolio-s4 .table .top-box {
  display: flex;
}

.portfolio-s4 .table .top-box span {
  color: #fff;
  padding: 1rem 2.5rem;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
}

.portfolio-s4 .table .top-box span:nth-of-type(1) {
  width: 24%;
  border: none;
}

.portfolio-s4 .table .top-box span:nth-of-type(2) {
  width: 18%;
}

.portfolio-s4 .table .top-box span:nth-of-type(3) {
  width: 58%;
}

.portfolio-s4 .table .bot-box {
  position: relative;
}

.portfolio-s4 .table .bot-box:before {
  content: '';
  position: absolute;
  top: .625rem;
  right: .625rem;
  bottom: .625rem;
  left: .625rem;
  border-radius: 5px;
}

.portfolio-s4 .table .bot-box .flex {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 2;
}

.portfolio-s4 .table .bot-box .cell-box {
  padding: 1rem 2.5rem;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  height: 8.75rem;
}

.portfolio-s4 .table .bot-box .cell-box:nth-of-type(1) {
  width: 24%;
  border: none;
}

.portfolio-s4 .table .bot-box .cell-box:nth-of-type(2) {
  width: 18%;
}

.portfolio-s4 .table .bot-box .cell-box:nth-of-type(3) {
  width: 58%;
}

.portfolio-s4 .table .bot-box span {
  display: block;
  color: #42474e;
}

.portfolio-s4 .b-para {
  padding: 3.75rem 7.5rem 0;
  color: #42474e;
  line-height: 1.6;
  text-align: justify;
}

.portfolio-s4 .b-para a {
  display: inline-block;
  color: #00639d;
}

.portfolio-s5 {
  padding-top: 7.5rem;
}

.portfolio-s5 .c-label .tit {
  color: #42474e;
  text-align: left;
}

.portfolio-s5 .top-para {
  color: #42474e;
  line-height: 1.8;
  margin-top: 1.5rem;
  text-align: justify;
}

.portfolio-s5 .bot-para {
  margin-top: 2rem;
  padding: 0 7rem 3.75rem;
  border-bottom: 1px solid #e6e6e6;
}

.portfolio-s5 .bot-para p {
  position: relative;
  color: #42474e;
  line-height: 1.6;
  padding-left: 1.25rem;
  text-align: justify;
}

.portfolio-s5 .bot-para p:before {
  content: '·';
  position: absolute;
  top: 0;
  left: 0;
  color: #42474e;
  line-height: 1.6;
}

.portfolio-s5 .bot-para p span {
  color: #00639d;
}

.portfolio-s5 .bot-para .tip {
  color: #42474e;
  line-height: 1.6;
  margin-top: 2rem;
  text-align: justify;
}

.portfolio-s6 {
  padding: 7.5rem 0;
}

.portfolio-s6 .c-label .tit {
  color: #42474e;
  text-align: left;
}

.portfolio-s6 .items {
  margin-top: 2.5rem;
}

.portfolio-s6 .item {
  padding-bottom: 2.5rem;
  margin-bottom: 2.5rem;
  border-bottom: 1px solid #e6e6e6;
  display: flex;
  align-items: center;
}

.portfolio-s6 .item:last-of-type {
  margin-bottom: 0;
}

.portfolio-s6 .item .img-box {
  width: 20rem;
  height: 11.25rem;
  border: 1px solid #e6e6e6;
  text-align: center;
}

.portfolio-s6 .item .img-box img {
  width: auto;
  max-width: 70%;
  max-height: 60%;
}

.portfolio-s6 .item .txt-box {
  width: calc(100% - 20rem);
  padding-left: 2.5rem;
}

.portfolio-s6 .item span {
  display: block;
  color: #42474e;
}

.portfolio-s6 .item p {
  color: #42474e;
  line-height: 1.6;
  text-align: justify;
  margin-top: 1.5rem;
}

.portfolio-s6 .tip {
  color: #42474e;
  line-height: 1.6;
  margin-top: 3.75rem;
  padding: 0 7.5rem;
}

.portfolio-s6 .tip a {
  display: inline-block;
  color: #00639d;
}

.portfolio-s7 {
  padding: 7.5rem 0;
}

.portfolio-s7 .c-label .tit {
  color: #42474e;
  text-align: left;
}

.portfolio-s7 .flex {
  display: flex;
  align-items: center;
}

.portfolio-s7 .img-box {
  width: 50%;
  border-radius: 10px;
  overflow: hidden;
}

.portfolio-s7 .img-box img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
  will-change: transform;
}

@media (any-hover: hover) {
  .portfolio-s7 .img-box:hover img {
    transform: scale(1.1);
  }
}

.portfolio-s7 .txt-box {
  width: 50%;
  padding-left: 3.75rem;
}

.portfolio-s7 .para {
  color: #42474e;
  line-height: 1.6;
  text-align: justify;
  margin-top: 1.5rem;
}

.portfolio-s7 .para a {
  display: inline-block;
  color: #00639d;
}

.other-s1 {
  padding: 7.5rem 0;
}

.other-s1 .top-para {
  color: #42474e;
  line-height: 1.8;
  text-align: justify;
}

.other-s1 .top-list {
  margin-top: 2.5rem;
  padding: 0 7.5rem;
}

.other-s1 .top-list span {
  display: block;
  color: #42474e;
}

.other-s1 .top-list .para {
  color: #42474e;
  line-height: 1.8;
  margin-top: 1.25rem;
}

.other-s1 .block {
  margin-top: 3.75rem;
  padding-top: 3.75rem;
  border-top: 1px solid #e6e6e6;
}

.other-s1 .block .tit {
  color: #42474e;
}

.other-s1 .block .para {
  margin-top: 2.5rem;
  padding: 0 7.5rem;
  color: #42474e;
  line-height: 1.8;
  text-align: justify;
}

.other-s2 {
  padding: 7.5rem 0;
}

.other-s2 .block {
  margin-top: 5rem;
}

.other-s2 .block:nth-of-type(1) {
  margin-top: 0;
}

.other-s2 .block .tit {
  position: relative;
  border-bottom: 1px solid #e6e6e6;
  cursor: pointer;
}

.other-s2 .block .tit span {
  display: inline-block;
  padding: 0 3.75rem;
  color: #42474e;
  padding-bottom: 2rem;
  position: relative;
}

.other-s2 .block .tit span:after {
  content: '';
  width: 100%;
  height: 1px;
  background-color: #00639d;
  position: absolute;
  bottom: -1px;
  left: 0;
}

.other-s2 .block .tit:after {
  content: '';
  width: 1.5rem;
  height: 1.5rem;
  position: absolute;
  right: 3.75rem;
  top: 8px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../fonts/icon-3-1.svg");
}

.other-s2 .block .para {
  color: #42474e;
  line-height: 1.8;
  margin-top: 2rem;
  padding: 0 7.5rem;
  text-align: justify;
}

.other-s2 .block.hide .tit:after {
  background-image: url("../fonts/icon-3-2.svg");
}

.other-s3 {
  padding: 7.5rem 0;
}

.other-s3 .item {
  margin-top: 3.75rem;
}

.other-s3 .item:nth-of-type(1) {
  margin-top: 0;
}

.other-s3 .item .tit {
  color: #42474e;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e6e6e6;
}

.other-s3 .item .link {
  margin-top: 1rem;
  font-size: 0;
  margin-right: -1.5rem;
}

.other-s3 .item .link a {
  display: inline-block;
  vertical-align: top;
  position: relative;
  width: auto;
  min-width: calc((100% - 6rem) / 4);
  margin: 1.5rem 1.5rem 0 0;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  color: #42474e;
  line-height: 3.75rem;
  padding: 0 calc(1.5rem + 10px) 0 1.5rem;
  transition: all .3s ease;
}

.other-s3 .item .link a:after {
  content: '';
  width: 5px;
  height: 9px;
  position: absolute;
  right: 1.5rem;
  top: 50%;
  margin-top: -5px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-4-1.png");
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .other-s3 .item .link a:hover {
    background-color: #00639d;
    color: #fff;
  }

  .other-s3 .item .link a:hover:after {
    background-image: url("../images/icon-4-2.png");
  }
}

.contact-s1 {
  padding: 7.5rem 0;
  font-size: 0;
}

.contact-s1 .para {
  line-height: 1.6;
  color: #42474e;
  text-align: center;
  margin-top: 2rem;
}

.contact-s1 .tab-tit {
  margin-top: 3.75rem;
  font-size: 0;
  border-bottom: 1px solid #e6e6e6;
  text-align: center;
}

.contact-s1 .tab-tit span {
  display: inline-block;
  vertical-align: top;
  width: 15rem;
  color: #42474e;
  position: relative;
  padding-bottom: 1.25rem;
  cursor: pointer;
  transition: color .3s ease;
}

.contact-s1 .tab-tit span:after {
  content: '';
  width: 100%;
  height: 4px;
  background-color: #00639d;
  position: absolute;
  bottom: -1px;
  left: 0;
  transform: scaleX(0);
}

.contact-s1 .tab-tit span.active {
  color: #00639d;
}

.contact-s1 .tab-tit span.active:after {
  transform: scaleX(1);
  transition: transform .3s ease;
}

@media (any-hover: hover) {
  .contact-s1 .tab-tit span:hover {
    color: #00639d;
  }

  .contact-s1 .tab-tit span:hover:after {
    transform: scaleX(1);
    transition: transform .3s ease;
  }
}

.contact-s1 .tab-cont {
  margin-top: 3.75rem;
}

.contact-s1 .tab-cont .child {
  display: none;
}

.contact-s1 .tab-cont .child.active {
  display: block;
}

.contact-s1 .tab-cont .child.active .img-box,
.contact-s1 .tab-cont .child.active .txt-box {
  animation: o-upfade-top 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.contact-s1 .tab-cont .child.active .txt-box {
  animation-delay: .1s;
}

.contact-s1 .tab-cont .img-box {
  width: 50%;
  display: inline-block;
  vertical-align: middle;
  border-radius: 10px;
  overflow: hidden;
  opacity: 0;
}

.contact-s1 .tab-cont .img-box img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
}

@media (any-hover: hover) {
  .contact-s1 .tab-cont .img-box:hover img {
    transform: scale(1.1);
  }
}

.contact-s1 .tab-cont .txt-box {
  width: 50%;
  display: inline-block;
  vertical-align: middle;
  padding-left: 3.75rem;
  opacity: 0;
}

.contact-s1 .tab-cont .box {
  margin-top: 2.5rem;
}

.contact-s1 .tab-cont .box:nth-of-type(1) {
  margin-top: 0;
}

.contact-s1 .tab-cont .box span {
  display: block;
  color: #00639d;
}

.contact-s1 .tab-cont .box p {
  color: #42474e;
  margin-top: 1rem;
}

.contact-s2 {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.contact-s2:before,
.contact-s2:after {
  content: '';
  width: 100%;
  height: 30%;
  position: absolute;
  left: 0;
  z-index: 1;
}

.contact-s2:before {
  top: 0;
  background-image: linear-gradient(180deg, #fff, transparent);
}

.contact-s2:after {
  bottom: 0;
  background-image: linear-gradient(180deg, transparent, rgba(0, 99, 157, 0.8));
}

.contact-s2 .map {
  height: 45rem;
}

.contact-s2 .map-box {
  height: 45rem;
  position: relative;
}

.contact-s2 .map-box .img-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  opacity: 0;
  transition: opacity .3s ease;
}

.contact-s2 .map-box .img-box img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.contact-s2 .map-box .img-box.active {
  opacity: 1;
}

.contact-s2 .info {
  width: calc(40% - 7.5rem);
  max-width: 600px;
  height: 12.5rem;
  position: absolute;
  left: calc(50% + 7.5rem);
  bottom: calc(50% + 5rem);
  background-color: #00639d;
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0, 99, 157, 0.3);
  z-index: 2;
}

.contact-s2 .info:before {
  content: '';
  width: 14.375rem;
  height: 15rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/img-2.png");
  position: absolute;
  right: 1.875rem;
  bottom: 0;
}

.contact-s2 .info:after {
  content: '';
  width: 6.6875rem;
  height: 2rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-2.png");
  position: absolute;
  top: 99%;
  left: 3.75rem;
}

.contact-s2 .info .cell-box {
  height: 100%;
}

.contact-s2 .info .box {
  width: 55%;
  padding-left: 2.5rem;
  display: none;
}

.contact-s2 .info .box.active {
  display: block;
}

.contact-s2 .info span {
  display: block;
  color: #fff;
}

.contact-s2 .info p {
  line-height: 1.6;
  color: #fff;
  margin-top: 10px;
}

.contact-s3 {
  padding: 7.5rem 0;
  font-size: 0;
}

.contact-s3.nomt .form {
  margin-top: 0;
}

.contact-s3 .form {
  width: 66.66%;
  margin: 3.75rem auto 0;
}

.contact-s3 .item {
  margin-top: 1.875rem;
}

.contact-s3 .item:nth-of-type(1) {
  margin-top: 0;
}

.contact-s3 .item .tit {
  color: #42474e;
}

.contact-s3 .item .tit i {
  color: #00639d;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
  font-style: normal;
  transform: translateY(4px);
}

.contact-s3 .item.half {
  width: calc((100% - 1.5rem) / 2);
  display: inline-block;
  vertical-align: top;
}

.contact-s3 .item.ml {
  margin-top: 0;
  margin-left: 1.5rem;
}

.contact-s3 .box {
  margin-top: 1.25rem;
  position: relative;
}

.contact-s3 .box.yzm {
  width: calc((100% - 1.5rem) / 2);
  display: inline-block;
  vertical-align: bottom;
}

.contact-s3 input {
  display: block;
  width: 100%;
  height: calc(2.5rem + 20px);
  background-color: #f2f7fa;
  border-radius: 8px;
  padding: 0 5rem 0 1.25rem;
  color: #42474e;
}

.contact-s3 textarea {
  display: block;
  width: 100%;
  height: 10rem;
  background-color: #f2f7fa;
  border-radius: 8px;
  padding: 10px 5rem 10px 1.25rem;
  color: #42474e;
  resize: none;
}

.contact-s3 .maxl {
  position: absolute;
  right: 1.25rem;
  bottom: 1.25rem;
  line-height: 20px;
  color: #42474e;
}

.contact-s3 .code {
  display: inline-block;
  vertical-align: bottom;
  width: 9.0625rem;
  height: calc(2.5rem + 20px);
  margin-left: 1.5rem;
  border: 1px solid #e6e6e6;
  border-radius: 8px;
  overflow: hidden;
}

.contact-s3 .code img {
  display: block;
  width: 100%;
  height: 100%;
}

.contact-s3 button {
  display: block;
  width: 100%;
  height: calc(2.5rem + 20px);
  color: #fff;
  background-color: #00639d;
  cursor: pointer;
  border-radius: 8px;
  margin-top: 1.875rem;
}

.index-s1 {
  position: relative;
}

.index-s1 .item {
  position: relative;
  height: 100vh;
  overflow: hidden;
}

.index-s1 .item .img-box {
  height: 100%;
  position: relative;
  z-index: 1;
}

.index-s1 .item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.index-s1 .item .txt-box {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
}

.index-s1 .item span {
  display: block;
  width: 52rem;
  color: #0f1e34;
}

.index-s1 .item .tip {
  width: 52rem;
  color: #0f1e34;
}

.index-s1 .item p {
  width: 52rem;
  margin-top: 1.5rem;
  font-weight: 300;
  color: #0f1e34;
}

.index-s1 .item a {
  display: block;
  width: 15rem;
  margin-top: 3.75rem;
  line-height: 3.375rem;
  text-align: center;
  border: 2px solid rgba(15, 30, 52, 0.2);
  border-radius: 5px;
  font-weight: 300;
  color: #0f1e34;
  transition: all .3s ease;
}

.index-s1 .item a.gray {
  border-color: rgba(15, 30, 52, 0.2);
  color: #0f1e34;
}

@media (any-hover: hover) {
  .index-s1 .item a:hover {
    transform: translateY(-3px);
    border-color: #00639d;
    background-color: #00639d;
    color: #fff;
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.index-s1 .item.swiper-slide-active img {
  animation: scale-bg 6s linear forwards;
}

.index-s1 .pagination {
  position: absolute;
  bottom: 3.75rem;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 0;
  z-index: 2;
}

.index-s1 .pagination span {
  display: inline-block;
  vertical-align: top;
  position: relative;
  margin-left: 1rem;
  cursor: pointer;
}

.index-s1 .pagination span:nth-of-type(1) {
  margin-left: 0;
}

.index-s1 .pagination span:before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.2);
  opacity: 0;
}

.index-s1 .pagination span:after {
  content: '';
  width: 8px;
  height: 8px;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -4px 0 0 -4px;
}

.index-s1 .pagination span svg {
  fill: none;
  stroke: #fff;
  stroke-width: 2px;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  transform: rotate(-90deg);
}

.index-s1 .pagination span.active:before {
  opacity: 1;
}

.index-s1 .pagination span.active svg {
  animation: indexsvg 5.5s linear forwards;
}

.index-s1 .button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  cursor: pointer;
  opacity: 0;
  z-index: 2;
  transition: opacity .3s ease;
}

.index-s1 .button .btn {
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0.5;
  transition: opacity .3s ease;
}

@media (any-hover: hover) {
  .index-s1 .button .btn:hover {
    opacity: 1;
  }
}

.index-s1 .button.show {
  opacity: 1;
}

.index-s1 .prev {
  left: 3.75rem;
}

.index-s1 .prev .btn {
  background-image: url("../fonts/left.svg");
}

.index-s1 .next {
  right: 3.75rem;
}

.index-s1 .next .btn {
  background-image: url("../fonts/right.svg");
}

.index-s2 {
  position: relative;
  padding: 10rem 0;
  overflow: hidden;
}

.index-s2 .img-box {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
}

.index-s2 .img-box img {
  display: block;
  width: 100%;
  opacity: 0.3;
}

.index-s2 .tit {
  color: #00639d;
  text-align: center;
}

.index-s2 .para {
  color: #42474e;
  line-height: 1.8;
  font-weight: 300;
  margin-top: 1.5rem;
  text-align: center;
}

.index-s2 a.more {
  display: block;
  width: 15rem;
  margin: 7.5rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .index-s2 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.index-s3 {
  height: 100vh;
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../images/img-4.jpg");
}

.index-s3 .txt-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.index-s3 .box {
  width: 50%;
  margin-left: 50%;
}

.index-s3 .tit {
  color: #fff;
}

.index-s3 a {
  display: block;
  width: 15rem;
  margin-top: 7.5rem;
  line-height: 3.375rem;
  text-align: center;
  border: 2px solid #00a0e9;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .index-s3 a:hover {
    transform: translateY(-3px);
    background-color: #00a0e9;
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.index-s4 {
  position: relative;
  /* padding: 7.5rem 0 0; */
}

.index-s4 .mouse {
  width: 7.5rem;
  height: 7.5rem;
  position: fixed;
  top: 0;
  left: 0;
  margin: -3.75rem 0 0 -3.75rem;
  will-change: transform;
  z-index: 5;
  pointer-events: none;
}

.index-s4 .mouse:after {
  content: '';
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-size: 18% auto;
  background-image: url("../img/shou.svg?v2");
  /* transform: scale(0); */
}

.index-s4 .mouse.active:after {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: transform .8s ease;
}

.index-s4 .top-box {
  text-align: center;
}

.index-s4 .top-box .tit {
  color: #00639d;
}

.index-s4 .top-box p {
  color: #42474e;
  font-weight: 300;
  letter-spacing: .75rem;
  margin-top: 1.5rem;
}

.index-s4 .block {
  margin-top: 5rem;
  position: relative;
  border-top: 1px solid transparent;
  z-index: 1;
    cursor: pointer;
  
}

.index-s4 .block:before {
  content: '';
  width: 20%;
  height: calc(18.5vw + 11rem + 50px);
  display: block;
  margin: 0 auto;
  /*background-image: linear-gradient(180deg, #fff, #e5eff8);*/
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  border-radius: 0 0 12px 12px;
  z-index: 1;
}

.index-s4 .items {
  margin-top: -3.125vw;
  padding: 3.125vw 0;
  position: relative;
  z-index: 2;
}

.index-s4 .item {
  width: 20%;
}

.index-s4 .item .img-box {
  border-radius: 12px;
  overflow: hidden;
}

.index-s4 .item img {
  display: block;
  width: 100%;
  transition: transform .3s ease;
}

.index-s4 .item .txt-box {
  display: none;
}

@media screen and (min-width: 1020px) {
  .index-s4 .item:hover img {
    transform: scale(1.1);
  }
}

.index-s4 .info-box {
  position: relative;
  width: 20%;
  height: calc(18.5vw + 11rem + 100px);
  margin: -23vw auto 0;
  /*opacity: 0;*/
  transition: opacity .3s ease;
  /*z-index: 2;*/
    background-image: linear-gradient(180deg, #fff, #e5eff8);
}

.index-s4 .info-box a {
    position: absolute;
  display: block;
  top: 18.5vw;
  cursor: none;
  width: 100%;
}

.index-s4 .info-box .box {
  padding: 2.5rem;
  height: auto;
}

.index-s4 .info-box .tit {
  line-height: 2rem;
  font-weight: 300;
  color: #42474e;
  text-align: center;
}

.index-s4 .info-box p {
  line-height: 28px;
  /* font-weight: 300; */
  height: 112px;
  color: #42474e;
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 1.5rem;
}

.index-s4 .info-box i {
  display: block;
  width: 24px;
  height: 24px;
  margin: 0 auto 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/icon-1.svg");
}

.index-s4 .info-box.active {
  opacity: 1;
}

.index-s4 .button {
  width: 48px;
  height: 48px;
  position: absolute;
  bottom: 6.25vw;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 2;
  cursor: pointer;
}

.index-s4 .button-prev {
  left: 18vw;
  background-image: url("../images/left-1.svg");
}

.index-s4 .button-next {
  right: 18vw;
  background-image: url("../images/right-1.svg");
}

.index-s4 .pagination {
  font-size: 0;
  text-align: center;
  display: none;
}

.index-s4 .pagination span {
  display: inline-block;
  vertical-align: top;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  border: 1px solid #00639d;
  margin: 0 2px;
  cursor: pointer;
  transition: all .3s ease;
}

.index-s4 .pagination span.active {
  background-color: #00639d;
  border-color: #00639d;
}

.index-s5 {
  height: 350vh;
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../images/img-5.jpg");
}

.index-s5 .icon {
  height: 100vh;
  position: sticky;
  top: 0;
  overflow: hidden;
  z-index: 2;
}

.index-s5 .icon .box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform-origin: center;
}

.index-s5 .icon .line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.index-s5 .icon .line.line-1:before,
.index-s5 .icon .line.line-1:after {
  content: '';
  position: absolute;
  left: 0;
  width: 100%;
  height: calc(50vh - 30rem);
  background-color: #fff;
}

.index-s5 .icon .line.line-1:before {
  top: 0;
}

.index-s5 .icon .line.line-1:after {
  bottom: 0;
}

.index-s5 .icon .line.line-2:before,
.index-s5 .icon .line.line-2:after {
  content: '';
  position: absolute;
  top: 0;
  height: 100%;
  width: calc(50vw - 50rem);
  background-color: #fff;
}

.index-s5 .icon .line.line-2:before {
  left: 0;
}

.index-s5 .icon .line.line-2:after {
  right: 0;
}

.index-s5 .icon .img-box {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 120rem;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.index-s5 .icon img {
  display: block;
  width: 100%;
}

.index-s5 .txt-box {
  position: sticky;
  top: 0;
  height: 100vh;
  margin-top: -100vh;
  z-index: 3;
}

.index-s5 .txt-box .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
}

.index-s5 .cell-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.index-s5 .tit {
  text-align: center;
}

.index-s5 .para {
  color: #42474e;
  font-weight: 300;
  text-align: center;
  margin-top: 1.5rem;
}

.index-s5 .show {
  padding-top: 40rem;
}

.index-s5 .show .tit {
  color: #00639d;
}

.index-s5 .show .para {
  color: #42474e;
}

.index-s5 .show a.more {
  display: block;
  width: 15rem;
  margin: 3.75rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .index-s5 .show a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.index-s5 .hide {
  opacity: 0;
  visibility: hidden;
  transform: translateY(100px);
  padding-top: 20rem;
}

.index-s5 .hide .tit {
  color: #00a0e9;
}

.index-s5 .hide .para {
  color: #fff;
}

.index-s5 .hide a.more {
  display: block;
  width: 15rem;
  margin: 3.75rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  border: 2px solid #00a0e9;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .index-s5 .hide a.more:hover {
    transform: translateY(-3px);
    background-color: #00a0e9;
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.index-s6 {
  padding: 11.25rem 3.75rem;
}

.index-s6 .top-box {
  text-align: center;
}

.index-s6 .top-box .tit {
  color: #00639d;
}

.index-s6 .top-box p {
  color: #42474e;
  font-weight: 300;
  letter-spacing: .75rem;
  margin-top: 1.5rem;
}

.index-s6 .items {
  margin-top: 3.75rem;
  font-size: 0;
}

.index-s6 .item {
  display: inline-block;
  vertical-align: top;
  width: calc((100% - 6rem) / 3);
  margin-left: 3rem;
}

.index-s6 .item .img-box {
  border-radius: 12px;
  overflow: hidden;
}

.index-s6 .item img {
  display: block;
  width: 100%;
  height: 16.5vw;
  object-fit: cover;
  transition: transform .5s ease;
}

.index-s6 .item .txt-box {
  position: relative;
  padding: 3.75rem;
}

.index-s6 .item .txt-box:before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: linear-gradient(180deg, #fff, #e5eff8);
  border-radius: 0 0 12px 12px;
  z-index: 1;
  opacity: 0;
  transition: opacity .3s ease;
}

.index-s6 .item span {
  display: block;
  line-height: 1.6;
  font-weight: 300;
  color: #42474e;
  position: relative;
  z-index: 2;
}

@media screen and (min-width: 769px) {
  .index-s6 .item:nth-of-type(1) {
    margin-left: 0;
  }

  .index-s6 .item:nth-of-type(1),
  .index-s6 .item:nth-of-type(3) {
    transform: translateY(3.75rem);
  }
}

@media (any-hover: hover) {
  .index-s6 .item:hover img {
    transform: scale(1.1);
  }

  .index-s6 .item:hover .txt-box:before {
    opacity: 1;
  }
}

.index-s6 a.more {
  display: block;
  width: 15rem;
  margin: 3.75rem auto 0;
  line-height: 3.375rem;
  text-align: center;
  background-color: #00639d;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .index-s6 a.more:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.index-s7 {
  height: 100vh;
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../images/img-1.jpg");
}

.index-s7 .txt-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.index-s7 .tit {
  color: #fff;
}

.index-s7 .para {
  width: 48.75rem;
  font-weight: 300;
  color: #fff;
  letter-spacing: .75rem;
  margin-top: 1.5rem;
}

.index-s7 a {
  display: block;
  width: 15rem;
  margin-top: 7.5rem;
  line-height: 3.375rem;
  text-align: center;
  border: 2px solid #00a0e9;
  border-radius: 5px;
  font-weight: 300;
  color: #fff;
  transition: all .3s ease;
}

@media (any-hover: hover) {
  .index-s7 a:hover {
    transform: translateY(-3px);
    background-color: #00a0e9;
    box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
  }
}

.index-s8 {
  padding-bottom: 11.25rem;
}

.index-s8 .top-box {
  text-align: center;
}

.index-s8 .top-box .tit {
  color: #00639d;
}

.index-s8 .top-box p {
  color: #42474e;
  font-weight: 300;
  letter-spacing: .75rem;
  margin-top: 1.5rem;
}

.index-s8 .cont-box {
  margin-top: 2.5rem;
  display: flex;
  align-items: center;
}

.index-s8 .img-box {
  width: 45%;
  position: relative;
}

.index-s8 .img-box .img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: all .3s ease;
}

.index-s8 .img-box .img:nth-of-type(1) {
  position: relative;
}

.index-s8 .img-box .img.active {
  opacity: 1;
  visibility: visible;
}

.index-s8 .img-box img {
  display: block;
  width: 100%;
}

.index-s8 .txt-box {
  width: 55%;
}

.index-s8 .tit {
  color: #42474e;
}

.index-s8 .btn {
  margin-top: 5.625rem;
  font-size: 0;
}

.index-s8 .btn a {
  display: inline-block;
  vertical-align: middle;
  width: calc((100% - 2.5rem) / 3);
  max-width: 15rem;
  text-align: center;
  color: #00639d;
  border: 1px solid #00639d;
  line-height: 3.375rem;
  border-radius: 5px;
  font-weight: 300;
  margin-left: 1.25rem;
  transition: all .3s ease;
}

.index-s8 .btn a:nth-of-type(1) {
  margin-left: 0;
}

.index-s8 .btn a.active {
  background-color: #00639d;
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(0, 160, 233, 0.3);
}

/* 2023-08-08 */
.product-s1 {
  padding: 7.5rem 0;
}

.product-s1 .items {
  display: flex;
  flex-wrap: wrap;
  margin-right: -3.75rem;
}

.product-s1 .item {
  width: calc(50% - 3.75rem);
  margin: 3.75rem 3.75rem 0 0;
}

.product-s1 .item a {
  display: block;
  position: relative;
}

.product-s1 .item .img-box {
  border: 1px solid #e5e5e5;
  border-radius: 1.875rem;
  overflow: hidden;
  transition: all .3s ease;
}

.product-s1 .item img {
  display: block;
  width: 100%;
  transition: transform .5s ease;
}

.product-s1 .item .tit {
  position: absolute;
  top: 3.75rem;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 1.875rem;
  font-family: 'Krub-Medium';
}

.product-s1 .item .more {
  position: absolute;
  bottom: 3.125rem;
  left: 0;
  right: 0;
  text-align: center;
  font-size: max(14px, 1.125rem);
  color: #00639d;
}

.product-s1 .item .more:after {
  content: '';
  width: max(16px, 1.5rem);
  height: max(16px, 1.5rem);
  display: inline-block;
  vertical-align: middle;
  margin: -2px 0 0 .625rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../images/n-icon-1.png");
  transition: all .3s ease;
}

@media screen and (min-width: 769px) {

  .product-s1 .item:nth-of-type(1),
  .product-s1 .item:nth-of-type(2) {
    margin-top: 0;
  }
}

@media (any-hover: hover) {
  .product-s1 .item:hover .img-box {
    border-color: #00639d;
  }

  .product-s1 .item:hover img {
    transform: scale(1.05);
  }

  .product-s1 .item:hover .more:after {
    transform: rotate(90deg);
  }
}

@media screen and (max-width: 1800px) {
  .career-s4 .swiper {
    padding: 0 10vw;
  }

  .responsibility-s12 .swiper {
    padding: 0 10vw;
  }

  .about-s8 .swiper {
    padding: 0 10vw;
  }

  .responsibility-s6 .swiper {
    padding: 0 10vw;
  }

  .about-s7 .swiper {
    padding: 0 16vw;
  }

  .investor-s3 .next {
    right: -7.5rem;
  }

  .investor-s3 .prev {
    left: -7.5rem;
  }

  .investor-s8 .para {
    height: 202px;
  }
}

@media screen and (max-width: 1681px) {
  .c-subnav a {
    margin-right: 2.5rem;
  }

  .investor-s8 .para {
    height: 195px;
  }

  .index-s4 .info-box p {
    line-height: 24px;
    height: 96px;
  }
}

@media screen and (max-width: 1441px) {
  .c-subnav a {
    margin-right: 1.5rem;
  }

  .investor-s8 .para {
    height: 172px;
  }
}

@media screen and (max-width: 1367px) {
  .about-s7 .item.pic .txt-box {
    width: 60%;
    margin-left: 40%;
  }

  .career-s2 .filter .year-box {
    width: 20rem;
  }

  .career-s2 .filter .form {
    width: calc(100% - 21.5rem);
  }

  .career-s5 .item a {
    width: 9rem;
  }

  .contact-s2 .info {
    height: 15rem;
  }

  .portfolio-s2 .table .box .cate span {
    font-size: 12px;
  }
}

@media screen and (max-width: 1281px) {
  .responsibility-s9 .item .para {
    line-height: 1.2;
  }

  .responsibility-s7 .item p {
    line-height: 1.2;
  }

  .about-s7 .item .para {
    -webkit-line-clamp: 4;
  }

  .portfolio-s2 .table .box .cate span {
    font-size: 12px;
  }

  .portfolio-s2 .table .box .cate span i {
    font-size: 12px;
  }
}

@media screen and (max-width: 1025px) {
  .wrap-s {
    width: 90%;
  }

  .investor-s8 .para {
    height: 152px;
  }

  .c-bg-fixed,
  .responsibility-s3,
  .investor-s1,
  .investor-s2,
  .investor-s8,
  .index-s3,
  .index-s5,
  .index-s7 {
    background-attachment: inherit;
  }

  .c-crumbs {
    display: none;
  }

  .c-banner {
    margin-top: 0;
  }

  .c-banner img {
    height: 60vw;
    object-fit: cover;
  }

  .c-banner .tit {
    width: 100%;
    font-size: 3rem;
  }

  .c-subnav {
    white-space: nowrap;
  }

  .c-subnav a {
    width: auto;
    margin-right: 0;
    padding: 0 10px;
  }

  .about-s10 .r-box {
    display: none;
  }

  .about-s10 .year-box {
    display: none;
  }

  .about-s6 .tab-tit .box {
    justify-content: center;
  }

  .about-s6 .tab-cont .year span {
    font-size: 26rem;
  }

  .about-s6 .tab-cont .child {
    padding-bottom: 7rem;
  }

  .about-s6 .tab-cont .text {
    height: 12rem;
  }

  .about-s7 .swiper {
    padding: 0;
    margin: 2rem 5vw 0;
  }

  .about-s7 .item {
    padding: 0;
  }

  .about-s7 .item.pic .txt-box {
    width: 70%;
    margin-left: 30%;
  }

  .about-s8 .swiper,
  .career-s4 .swiper,
  .responsibility-s6 .swiper,
  .responsibility-s12 .swiper {
    padding: 0 5vw;
  }

  .career-s6 .share {
    display: none;
  }

  .contact-s2 .info {
    display: none;
  }

  .investor-s3 .button {
    display: none;
  }

  .investor-s3 .pagination {
    margin-top: 2rem;
    text-align: center;
    font-size: 0;
  }

  .investor-s3 .pagination span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
    vertical-align: top;
    background-color: #e6e6e6;
    margin-left: 5px;
  }

  .investor-s3 .pagination span:nth-of-type(1) {
    margin-left: 0;
  }

  .investor-s3 .pagination span.active {
    background-color: #00639d;
  }

  .media-s2 .share {
    display: none;
  }

  .media-s2 .para {
    margin: 2rem 0;
  }

  .other-s3 .item .link a {
    min-width: auto;
  }

  .responsibility-s15 .item .btns a {
    width: 9rem;
  }

  .index-s1 .item {
    height: 70vw;
  }

  .index-s1 {
    margin-top: 60px;
  }

  .index-s1 .button {
    display: none;
  }

  .index-s1 .item span {
    width: 100%;
    font-size: 2.4rem;
  }

  .index-s1 .item p {
    margin-top: 1rem;
    width: 100%;
  }

  .index-s1 .item .tip {
    width: 100%;
    font-size: 2.4rem;
  }

  .index-s1 .item a {
    margin-top: 2rem;
    width: 12rem;
  }

  .index-s1 .pagination {
    bottom: 1rem;
    transform-origin: bottom center;
    transform: scale(0.6);
  }

  .index-s3,
  .index-s7 {
    height: 60vh;
  }

  .index-s4 {
    padding: 7.5rem 5%;
  }

  .index-s4 .items {
    margin-top: 0;
    padding: 0;
  }

  .index-s4 .block {
    margin-top: 2rem;
  }

  .index-s4 .block:before {
    display: none;
  }

  .index-s4 .button {
    display: none;
  }

  .index-s4 .pagination {
    display: block;
  }

  .index-s4 .info-box {
    width: 100%;
    margin-top: 0;
    height: auto;
  }

  .index-s4 .info-box a {
    padding-top: 0;
  }

  .index-s4 .info-box p {
    height: auto;
  }

  .index-s5 {
    height: auto;
  }

  .index-s5 .icon {
    display: none;
  }

  .index-s5 .txt-box {
    position: relative;
    margin-top: 0;
    height: auto;
  }

  .index-s5 .show {
    display: none;
  }

  .index-s5 .hide {
    position: static;
    opacity: 1;
    transform: none;
    visibility: visible;
    padding: 7.5rem 0;
    background-color: rgba(0, 0, 0, 0.5);
  }

  .index-s6 .item img {
    height: 16vw;
  }

  .search-s1 .item:before,
  .search-s1 .item:after {
    height: 4px;
  }

  .search-s1 .ani {
    display: none;
  }

  .search-s1 .item i {
    width: 14px;
    height: 14px;
  }
}

@media screen and (max-width: 769px) {
  .search-s1 {
    padding: 4rem 0;
  }

  .search-s1 .link {
    text-align: left;
  }

  .search-s1 .link a {
    margin: 0 1rem 1rem 0;
  }

  .about-s4 {
    padding: 4rem 0;
  }

  .about-s4 .block {
    margin: 4rem 0;
  }

  .about-s4 .center-box {
    display: none;
  }

  .about-s4 .items {
    display: block;
  }

  .about-s4 .item {
    display: block;
    width: 100%;
    height: auto;
    padding: 2rem;
    margin-top: 2rem;
  }

  .about-s4 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .about-s4 .item:before,
  .about-s4 .item .b-icon {
    display: none;
  }

  .about-s4 .item .icon {
    position: static;
    width: 4rem;
    height: 4rem;
  }

  .about-s4 .item .tit {
    position: static;
    width: 100%;
    margin-top: 2rem;
  }

  .about-s4 .item i {
    position: static;
    display: block;
  }

  .about-s4 .item i.hide {
    display: none;
  }

  .about-s10 {
    padding: 4rem 0;
  }

  .about-s10 .line {
    left: 5px;
    margin-left: 0;
    top: 5px;
    height: calc(100% - 5px);
  }

  .about-s10 .icon {
    display: none;
  }

  .about-s10 .items {
    padding: 0;
  }

  .about-s10 .item {
    width: 100%;
    margin-top: 4rem;
    padding-left: 4rem;
    min-height: auto;
  }

  .about-s10 .item span:before {
    left: -4rem;
    margin-top: -7px;
  }

  .about-s10 .item .img-box {
    width: 100%;
    max-width: 30rem;
  }

  .about-s3 {
    padding: 4rem 0;
  }

  .about-s3 .item .tit {
    height: auto;
    padding: 1.5rem 0;
  }

  .about-s3 .item .hide {
    margin-top: 0;
    padding: 0 0 2rem;
  }

  .about-s3 .item .tit:after {
    width: 2rem;
    height: 2rem;
    right: 0;
    margin-top: -1rem;
  }

  .about-s3 .item .tit span {
    font-size: 1.6rem !important;
  }

  .about-s3 .item .img-box {
    width: 12rem;
    float: left;
    margin-right: 1.5rem;
  }

  .about-s3 .item.pic .para {
    width: 100%;
    padding-left: 0;
    display: block;
  }

  .about-s2 {
    padding: 4rem 0;
  }

  .about-s2 .item {
    width: calc(50% - .75rem);
    margin: 0 1.5rem 0 0;
  }

  .about-s2 .item:nth-of-type(even) {
    margin-right: 0;
  }

  .about-s2 .item .img-box {
    height: 35rem;
  }

  .team-pop .img-box {
    display: none;
  }

  .team-pop .txt-box {
    width: 100%;
    padding-left: 0;
  }

  .team-pop .para {
    max-height: 70vh;
  }

  .about-s1 {
    padding: 4rem 0;
  }

  .about-s1 .item {
    margin-top: 4rem;
  }

  .about-s5 {
    padding: 4rem 0;
  }

  .about-s5 .items {
    display: block;
    margin-top: 2rem;
  }

  .about-s5 .item {
    width: 100%;
    margin: 2rem 0 0;
    padding: 4rem;
  }

  .about-s5 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .about-s6 {
    padding: 0;
  }

  .about-s6 .tab-cont .year span {
    font-size: 12rem;
  }

  .about-s6 .tab-cont .child {
    padding-bottom: 10rem;
  }

  .about-s6 .tab-tit .box {
    justify-content: inherit;
  }

  .about-s7 {
    padding: 4rem 0;
  }

  .about-s7 .item .box {
    border-radius: 10px;
  }

  .about-s7 .item.pic .img-box {
    display: none;
  }

  .about-s7 .item.pic .txt-box {
    width: 100%;
    margin-left: 0;
  }

  .about-s7 .item .txt-box {
    padding: 2rem;
  }

  .about-s7 .item {
    opacity: 1;
  }

  .about-s7 .item a {
    left: 2rem;
    bottom: 2rem;
  }

  .about-s8 {
    padding: 0;
  }

  .about-s8 .items,
  .career-s4 .items,
  .responsibility-s6 .items,
  .responsibility-s12 .items {
    margin: 2rem 5% 0;
  }

  .about-s8 .swiper,
  .career-s4 .swiper,
  .responsibility-s6 .swiper,
  .responsibility-s12 .swiper {
    padding: 0;
  }

  .about-s8 .swiper-control,
  .career-s4 .swiper-control,
  .responsibility-s6 .swiper-control,
  .responsibility-s12 .swiper-control {
    width: 80%;
    max-width: 30rem;
  }

  .about-s9 {
    padding: 4rem 0;
  }

  .about-s9 .flex {
    display: block;
  }

  .about-s9 .flex .img-box {
    width: 100%;
  }

  .about-s9 .flex .txt-box {
    width: 100%;
    padding-left: 0;
  }

  .about-s9 .flex a:nth-of-type(1) {
    border: none;
  }

  .career-s1 {
    padding: 4rem 0;
  }

  .career-s1 .item {
    margin-top: 1rem;
    height: auto;
  }

  .career-s1 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .career-s1 .item:nth-of-type(4) {
    height: 40vw;
  }

  .career-s2 {
    padding: 4rem 0;
  }

  .career-s2 .filter {
    margin-top: 2rem;
    padding: 0;
  }

  .career-s2 .filter .year-box {
    width: 100%;
    margin: 0 0 10px 0;
  }

  .career-s2 .filter .form {
    width: 100%;
  }

  .career-s2 .filter .form input {
    font-size: 13px;
  }

  .career-s3 {
    padding: 0 0 4rem;
  }

  .career-s3 .box {
    display: block;
  }

  .career-s3 .item {
    width: 100%;
    height: auto;
    margin: 2rem 0 0;
  }

  .career-s3 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .career-s3 .item a {
    padding: 2rem;
  }

  .career-s3 .item span {
    margin-top: 0;
  }

  .career-s3 .item p {
    opacity: 1;
    color: #42474e;
  }

  .career-s3 .item a:after {
    width: 2rem;
    height: 2rem;
    background-image: url("../images/icon-2-1.png");
  }

  .career-s4 {
    padding: 0 0 4rem;
  }

  .career-s5 {
    padding-bottom: 4rem;
  }

  .career-s5 .item .box {
    padding: 2rem 0;
  }

  .career-s5 .item .opa {
    display: block;
    opacity: 1;
  }

  .career-s5 .item a {
    position: static;
    display: block;
    margin-top: 1rem;
  }

  .comm-page li {
    margin: 0;
  }

  .career-s6 {
    padding: 4rem 0;
  }

  .career-s6 .info {
    padding: 2rem 0;
  }

  .career-s7 {
    padding: 4rem 0;
  }

  .career-s7 .items {
    margin-top: 2rem;
    display: block;
  }

  .career-s7 .item {
    margin: 2rem 0 0;
    height: auto;
  }

  .career-s7 .item .show {
    position: relative;
  }

  .career-s7 .item .hide {
    position: absolute;
    top: 0;
    left: 0;
  }

  .career-s7 .item .tit {
    max-width: calc(100% - 2rem);
  }

  .career-s7 .item .show:after {
    bottom: 2rem;
  }

  .career-s8 {
    padding: 0 0 4rem;
  }

  .career-s8 .item .tit {
    padding: 2rem 5rem 2rem 2rem;
  }

  .career-s8 .item .tit:after {
    right: 2rem;
  }

  .career-s8 .item .para {
    margin-top: 0;
    padding: 0 2rem 2rem;
  }

  .career-s8 .item:before {
    top: 5px;
    bottom: 5px;
  }

  .contact-s1 {
    padding: 4rem 0;
  }

  .contact-s1 .tab-tit span {
    font-size: 14px;
    width: auto;
    margin-left: 10px;
  }

  .contact-s1 .tab-tit span:nth-of-type(1) {
    margin-left: 0;
  }

  .contact-s1 .tab-cont {
    margin-top: 2rem;
  }

  .contact-s1 .tab-cont .img-box {
    width: 100%;
  }

  .contact-s1 .tab-cont .txt-box {
    width: 100%;
    padding-left: 0;
    margin-top: 2rem;
  }

  .contact-s3 {
    padding: 4rem 0;
  }

  .contact-s3 .form {
    width: 100%;
  }

  .investor-s5 {
    padding: 4rem 0;
  }

  .investor-s1.style-2 {
    padding: 4rem 0;
  }

  .investor-s1 .items {
    flex-wrap: wrap;
  }

  .investor-s1 .item {
    width: 50%;
    margin-top: 4rem;
  }

  .investor-s1 .item:nth-of-type(1),
  .investor-s1 .item:nth-of-type(2) {
    margin-top: 0;
  }

  .investor-s1 .item .num {
    margin-top: 1rem;
  }

  .investor-s6 {
    padding: 4rem 0;
  }

  .investor-s6 .item a {
    padding: 2rem 0;
    display: block;
  }

  .investor-s6 .item .date span,
  .investor-s6 .item .date i {
    display: inline-block;
  }

  .investor-s6 .item .txt-box {
    width: 100%;
    margin-top: 1rem;
  }

  .investor-s7 {
    padding: 4rem 0;
  }

  .investor-s7 .item {
    padding: 4rem 0;
  }

  .investor-s7 .item:nth-of-type(1) {
    padding-top: 0;
  }

  .investor-s7 .item .img-box {
    width: 100%;
  }

  .investor-s7 .item .txt-box {
    width: 100%;
    position: static;
    transform: none;
    padding-top: 1rem;
  }

  .investor-s7 .item .tit {
    text-align: center;
  }

  .investor-s7 .item .btns {
    text-align: center;
    margin-top: 2rem;
  }

  .investor-s1.style-1 {
    padding: 4rem 0;
  }

  .investor-s1.style-1 .items {
    margin-top: 2rem;
  }

  .investor-s1 a.more {
    margin-top: 2.5rem;
  }

  .investor-s2 {
    padding: 4rem 0;
  }

  .investor-s2 .cont {
    display: block;
  }

  .investor-s2 .box {
    width: 100%;
  }

  .investor-s2 .link {
    width: 100%;
    margin-left: 0;
  }

  .investor-s2 .link a:nth-of-type(1) {
    border-top: none;
  }

  .investor-s2 .n-box {
    width: 100%;
    height: 20rem;
    margin-left: 0;
    margin-top: 2rem;
  }

  .investor-s2 .n-box-1 {
    width: 100%;
    margin-left: 0;
    margin-top: 2rem;
  }

  .investor-s3 {
    padding: 4rem 0;
  }

  .investor-s4 {
    padding: 0 0 4rem;
  }

  .investor-s4 .item {
    padding: 0;
  }

  .investor-s4 .item span {
    font-size: 14px;
    padding: 0 5px;
  }

  .investor-s8 {
    padding: 4rem 0;
  }

  .investor-s9 {
    padding-bottom: 4rem;
  }

  .investor-s10 {
    padding: 4rem 0;
  }

  .investor-s10 table td a {
    margin-left: 0;
  }

  .investor-s11 {
    padding: 4rem 0;
  }

  .investor-s11 .items {
    display: block;
  }

  .investor-s11 .item:nth-of-type(2) {
    margin: 10px 0 0;
  }

  .investor-s11 .item .info {
    padding: 2rem;
  }

  .investor-s12 {
    padding: 4rem 0;
  }

  .investor-s12 .item {
    width: 100%;
  }

  .investor-s12 .item:nth-of-type(2) {
    margin: 2rem 0 0;
  }

  .other-s2 {
    padding: 4rem 0;
  }

  .other-s2 .block .tit span {
    padding: 0 0 1rem;
    max-width: calc(100% - 30px);
  }

  .other-s2 .block .tit:after {
    right: 0;
    top: 2px;
  }

  .other-s2 .block .para {
    padding: 0;
  }

  .other-s2 .block {
    margin-top: 4rem;
  }

  .media-s1 {
    padding: 4rem 0;
  }

  .media-s1 .filter {
    padding: 0;
  }

  .media-s1 .filter .year-box {
    width: 100%;
    margin: 10px 0 0 0;
  }

  .media-s1 .filter .form {
    width: 100%;
  }

  .media-s1 .filter .form input {
    font-size: 13px;
  }

  .media-s1 .items {
    margin: 2rem 0 4rem;
    display: block;
  }

  .media-s1 .item {
    width: 100%;
  }

  .media-s1 .item:nth-of-type(1) a {
    padding-top: 0;
  }

  .media-s1 .item a {
    padding: 2rem 0;
  }

  .media-s2 {
    padding: 4rem 0;
  }

  .media-s2 .bot-block {
    margin-top: 4rem;
  }

  .media-s2 .bot-block .items {
    display: block;
  }

  .media-s2 .bot-block .item {
    width: 100%;
    margin: 4rem 0 0;
  }

  .media-s2 .bot-block .item:nth-of-type(1) {
    margin-top: 0;
  }

  .media-s2 .bot-block .item .txt-box {
    padding: 2rem 0 0;
  }

  .media-s3 {
    padding: 2rem 0;
  }

  .media-s3 a {
    margin-left: 1rem;
    padding: 2rem 0 1rem;
  }

  .media-s3 a i {
    width: 3rem;
    height: 3rem;
  }

  .media-s3 a span {
    font-size: 12px;
  }

  .media-s3 a:after {
    height: 2px;
  }

  .media-s4 {
    padding: 4rem 0;
  }

  .media-s4 .flex {
    display: block;
  }

  .media-s4 .img-box {
    width: 100%;
  }

  .media-s4 .txt-box {
    width: 100%;
    padding: 4rem 0;
  }

  .media-s4 .txt-box a {
    margin-top: 2.5rem;
  }

  .media-s4 .para,
  .media-s5 .para,
  .media-s6 .para,
  .media-s7 .para {
    padding: 2rem 0 0;
  }

  .media-s5 {
    padding: 4rem 0;
  }

  .media-s5 .items {
    display: block;
  }

  .media-s5 .item {
    width: 100%;
    margin: 2rem 0 0;
    height: auto;
  }

  .media-s5 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .media-s5 .item .show {
    position: static;
    padding: 6rem 0;
  }

  .media-s5 .item .hide {
    position: static;
    opacity: 1;
    padding: 2rem;
  }

  .media-s6 {
    padding: 4rem 0;
  }

  .media-s6 .items {
    display: block;
  }

  .media-s6 .item {
    width: 100%;
    margin: 2rem 0 0;
  }

  .media-s6 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .media-s7 {
    padding: 4rem 0;
  }

  .media-s7 .items {
    display: block;
  }

  .media-s7 .item {
    width: 100%;
    margin: 2rem 0 0;
  }

  .media-s7 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .other-s1 {
    padding: 4rem 0;
  }

  .other-s1 .top-list {
    padding: 0 2rem;
    margin-top: 2rem;
  }

  .other-s1 .block {
    margin-top: 4rem;
    padding-top: 4rem;
  }

  .other-s1 .block .para {
    margin-top: 2rem;
    padding: 0;
  }

  .other-s3 {
    padding: 4rem 0;
  }

  .other-s3 .item {
    margin-top: 4rem;
  }

  .other-s3 .item .link {
    margin-right: -5px;
  }

  .other-s3 .item .link a {
    margin: 5px 5px 0 0;
    padding: 0 30px 0 20px;
  }

  .other-s3 .item .link a:after {
    right: 1rem;
  }

  .portfolio-s1 {
    padding: 4rem 0;
  }

  .portfolio-s1 .img-box {
    width: 100%;
    max-width: 26rem;
  }

  .portfolio-s1 .items {
    margin-top: 4rem;
  }

  .portfolio-s2 {
    padding: 4rem 0;
  }

  .portfolio-s2 .cont {
    margin-top: 2rem;
    overflow-x: auto;
    padding-bottom: 10px;
  }

  .portfolio-s2 .table {
    min-width: 900px;
  }

  .portfolio-s2 .table .box .cate span {
    font-size: 12px;
  }

  .portfolio-s3 {
    padding: 0 0 4rem;
  }

  .portfolio-s3 .item .tit span {
    font-size: 1.8rem;
  }

  .portfolio-s3 .item .tit span {
    transform: scale(0.9);
  }

  .portfolio-s4 {
    padding: 4rem 0;
  }

  .portfolio-s4 .item {
    margin-top: 4rem;
  }

  .portfolio-s4 .table {
    min-width: 600px;
  }

  .portfolio-s4 .table .top-box span {
    padding: 1rem;
  }

  .portfolio-s4 .table .bot-box .cell-box {
    padding: 1rem;
  }

  .portfolio-s4 .cont {
    overflow-x: auto;
    padding-bottom: 10px;
  }

  .portfolio-s5 {
    padding-top: 4rem;
  }

  .portfolio-s5 .bot-para {
    padding: 0 2rem 2rem;
  }

  .portfolio-s6 {
    padding: 4rem 0;
  }

  .portfolio-s6 .tip {
    margin-top: 2rem;
    padding: 0;
  }

  .portfolio-s6 .item {
    padding-bottom: 4rem;
    margin-bottom: 4rem;
    display: block;
  }

  .portfolio-s6 .item .img-box {
    width: 100%;
  }

  .portfolio-s6 .item .txt-box {
    width: 100%;
    padding-left: 0;
    margin-top: 2rem;
  }

  .portfolio-s7 {
    padding: 4rem 0;
  }

  .portfolio-s7 .flex {
    display: block;
  }

  .portfolio-s7 .img-box {
    width: 100%;
  }

  .portfolio-s7 .txt-box {
    width: 100%;
    padding-left: 0;
    margin-top: 2rem;
  }

  .responsibility-s1 {
    padding: 4rem 0;
  }

  .responsibility-s1 .items {
    margin-top: 2rem;
  }

  .responsibility-s1 .item {
    margin-top: 2rem;
    display: block;
  }

  .responsibility-s1 .item .img-box {
    width: 100%;
  }

  .responsibility-s1 .item .txt-box {
    width: 100%;
    margin-top: 2rem;
  }

  .responsibility-s2 {
    padding: 0 0 4rem;
  }

  .responsibility-s2 .items {
    margin-top: 2rem;
    display: block;
  }

  .responsibility-s2 .item {
    padding: 2rem;
  }

  .responsibility-s2 .item:nth-of-type(2) {
    margin: 2rem 0 0;
  }

  .responsibility-s2 .item i {
    width: 5rem;
    height: 5rem;
  }

  .responsibility-s2 .item .tit {
    margin-top: 0;
  }

  .responsibility-s2 .item:after {
    margin-top: 2rem;
  }

  .text-modal .main {
    padding: 2.5rem 2rem;
  }

  .text-modal .tit {
    padding-right: 4rem;
  }

  .responsibility-s3 {
    padding: 4rem 0;
  }

  .responsibility-s4 {
    padding: 4rem 0;
  }

  .responsibility-s4 .flex {
    display: block;
  }

  .responsibility-s4 .flex .img-box {
    width: 100%;
  }

  .responsibility-s4 .flex .txt-box {
    width: 100%;
    padding: 0;
  }

  .responsibility-s4 .flex a:nth-of-type(1) {
    border-top: none;
  }

  .responsibility-s5 {
    padding: 4rem 0;
  }

  .responsibility-s5 .txt-box {
    margin-top: 2rem;
    padding: 0;
  }

  .responsibility-s5 .txt-box:after {
    display: none;
  }

  .responsibility-s5 .box {
    padding: 0;
    width: 100%;
  }

  .responsibility-s6 {
    padding: 0 0 4rem;
  }

  .responsibility-s6.pt {
    padding-top: 4rem;
  }

  .responsibility-s7 {
    padding: 0 0 4rem;
  }

  .responsibility-s7.pt {
    padding-top: 4rem;
  }

  .responsibility-s7 .items {
    display: block;
  }

  .responsibility-s7 .item {
    height: auto;
    padding: 2rem;
    margin: 2rem 0 0;
  }

  .responsibility-s7 .item i {
    width: 5rem;
    height: 5rem;
  }

  .responsibility-s7 .item .tit {
    margin-top: 0;
  }

  .responsibility-s7 .item:after {
    display: block;
    position: static;
    margin-top: 1rem;
  }

  .responsibility-s7 .item.flip .show {
    position: relative;
    padding: 2rem;
  }

  .responsibility-s7 .item.flip .show:after {
    display: none;
  }

  .responsibility-s7 .item.flip .show p {
    display: block;
    line-height: 1.6;
  }

  .responsibility-s7 .item.flip .hide {
    display: none;
  }

  .responsibility-s7 .para.mt {
    margin-top: 2rem;
  }

  .responsibility-s8 {
    padding: 4rem 0;
  }

  .responsibility-s8 .tit {
    background-size: 8rem auto;
  }

  .responsibility-s9 {
    padding: 4rem 0;
  }

  .responsibility-s9 .items {
    display: block;
  }

  .responsibility-s9 .item {
    height: auto;
    margin: 2rem 0 0;
  }

  .responsibility-s9 .item .show {
    position: relative;
  }

  .responsibility-s9 .item .hide {
    position: absolute;
    top: 0;
    left: 0;
  }

  .responsibility-s9 .item .tit {
    max-width: calc(100% - 2rem);
  }

  .responsibility-s9 .item .show:after {
    bottom: 2rem;
  }

  .responsibility-s10 {
    padding: 4rem 0;
  }

  .responsibility-s10 .items {
    display: block;
  }

  .responsibility-s10 .item {
    padding: 2rem;
  }

  .responsibility-s10 .item:nth-of-type(2) {
    margin: 2rem 0 0;
  }

  .responsibility-s10 .item i {
    width: 5rem;
    height: 5rem;
  }

  .responsibility-s10 .item:after {
    margin-top: 2rem;
  }

  .responsibility-s11 .flex {
    display: block;
  }

  .responsibility-s11 .flex .img-box {
    width: 100%;
  }

  .responsibility-s11 .flex .txt-box {
    width: 100%;
    margin: 0;
  }

  .responsibility-s12 {
    padding: 4rem 0;
  }

  .responsibility-s13 {
    padding-bottom: 4rem;
  }

  .responsibility-s13 .center-box {
    display: none;
  }

  .responsibility-s13 .items {
    display: block;
  }

  .responsibility-s13 .item {
    display: block;
    width: 100%;
    height: auto;
    padding: 2rem;
    margin-top: 2rem;
    border-radius: 10px;
  }

  .responsibility-s13 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .responsibility-s13 .item span {
    position: static;
    padding: 0;
  }

  .responsibility-s13 .item .tit {
    position: static;
    padding: 0;
    margin-top: 1rem;
  }

  .responsibility-s14 {
    padding: 4rem 0;
  }

  .responsibility-s14 .flex {
    display: block;
  }

  .responsibility-s14 .flex .img-box {
    width: 100%;
  }

  .responsibility-s14 .flex .txt-box {
    width: 100%;
    padding-left: 0;
    margin-top: 2rem;
  }

  .responsibility-s15 {
    padding: 4rem 0;
  }

  .responsibility-s15 .single {
    display: block;
  }

  .responsibility-s15 .single .img-box {
    width: 100%;
  }

  .responsibility-s15 .single .txt-box {
    width: 100%;
  }

  .responsibility-s15 .single .tit {
    text-align: center;
  }

  .responsibility-s15 .single .btns {
    margin-top: 2rem;
    text-align: center;
  }

  .responsibility-s15 .items {
    margin-top: 4rem;
  }

  .responsibility-s15 .item {
    padding: 2rem 0;
    display: block;
  }

  .responsibility-s15 .item span {
    width: 100%;
  }

  .responsibility-s15 .item .btns {
    margin-top: 1rem;
  }

  .index-s2 {
    padding: 4rem 0;
  }

  .index-s2 .img-box {
    width: 160%;
    margin-left: -30%;
  }

  .index-s2 a.more {
    margin-top: 3.75rem;
  }

  .index-s2 .para {
    line-height: 1.5;
  }

  .index-s3 .box {
    width: 70%;
    margin-left: 30%;
  }

  .index-s3 {
    height: auto;
    padding: 8rem 0;
  }

  .index-s3 .txt-box {
    position: static;
  }

  .index-s3 a {
    margin-top: 3.75rem;
  }

  .index-s4 {
    padding: 4rem 5%;
  }

  .index-s6 {
    padding: 4rem 5%;
  }

  .index-s6 .items {
    margin-top: 2rem;
  }

  .index-s6 .item {
    width: 100%;
    margin: 4rem 0 0;
  }

  .index-s6 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .index-s6 .item img {
    height: 50vw;
  }

  .index-s6 .item .txt-box {
    padding: 2rem 0 0;
  }

  .index-s7 .para {
    width: 100%;
  }

  .index-s8 {
    padding-bottom: 4rem;
  }

  .index-s8 .cont-box {
    display: block;
  }

  .index-s8 .img-box {
    width: 100%;
  }

  .index-s8 .txt-box {
    width: 100%;
  }

  .index-s8 .tit {
    text-align: center;
  }

  .index-s8 .btn {
    margin-top: 2rem;
  }

  .index-s8 .btn a {
    width: calc((100% - 10px) / 2);
    max-width: none;
    margin: 0 10px 10px 0;
  }

  .index-s8 .btn a:nth-of-type(even) {
    margin-right: 0;
  }

  .index-s7 {
    height: auto;
    padding: 6rem 0;
  }

  .index-s7 .txt-box {
    position: static;
  }

  .index-s7 a {
    margin-top: 3.75rem;
  }

  .product-s1 {
    padding: 4rem 0;
  }

  .product-s1 .items {
    display: block;
    margin-right: 0;
  }

  .product-s1 .item {
    width: 100%;
    margin-top: 2rem;
  }

  .product-s1 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .product-s1 .item .tit {
    top: 2rem;
  }

  .product-s1 .item .more {
    bottom: 2rem;
  }

  .media-s1 .item img {
    height: 24vw;
  }

  .media-s2 .bot-block .item img {
    height: 50vw;
  }
}

@media screen and (max-width: 481px) {
  .search-s1 .form {
    width: 100%;
  }

  .about-s2 .item {
    width: 100%;
    margin: 2rem 0 0;
  }

  .about-s2 .item:nth-of-type(1) {
    margin-top: 0;
  }

  .about-s2 .item .img-box {
    height: 90vw;
  }

  .career-s5 .item .info span {
    display: block;
    margin-right: 0;
  }

  .career-s5 .item .info span:nth-of-type(2) {
    margin-top: 5px;
  }

  .career-s6 .info span {
    display: block;
    margin-right: 0;
  }

  .career-s6 .info span:nth-of-type(2) {
    margin-top: 5px;
  }

  .media-s1 .item a {
    display: block;
    padding: 4rem 0;
  }

  .media-s1 .item .img-box {
    width: 100%;
  }

  .media-s1 .item .txt-box {
    width: 100%;
    padding-left: 0;
    margin-top: 2rem;
  }

  .media-s1 .item img {
    height: 50vw;
  }
}

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