@charset "UTF-8";

/*config*/

html {

  width: 100%;

  height: 100%;

  overflow: hidden; }

.show-img{
  /*display: block!important;*/
}
.big-img{
  display: none;
}
pre {

  border: none; }

.am-slider-a1 .am-control-nav {
    width: 100%;
    position: absolute;
    bottom: 20px;
    text-align: center;
    line-height: 0;
}

body {

  width: 100%;

  height: 100%;

  overflow-x: hidden;

  overflow-y: auto; }



img {

  max-width: 100%; }



.nav {

  margin: 2rem 0;

  font-size: 1.4rem; }

  .nav span {

    color: #999;

    padding-left: 2px; }



.page {

  margin: 3rem 0;

  text-align: center; }

  .page a ,.page span{

    border: 1px solid #ccc;

    color: #999;

    padding: 0.5rem 1rem;

    margin: 0 0.2rem;

    font-size: 1.2rem; }

  .page .active-page {

    background: #ef5600;

    color: #fff !important; 
}



.page_nowindex {

  background: #0a6ce1;

  color: #fff !important; }



.center {


  width: 70%;

margin: 0 auto;
max-width: 1200px;
  min-width: 1000px; }



.border-bottom {

  background: url("../images/title-bottom.jpg") no-repeat bottom center;

  padding-bottom: 0.5rem; }



.slider {


  overflow: hidden; }



.am-slider-a1 .am-control-nav li a {

  width: 20px;

  height: 20px;

  background-color: #fff; }



/*澶撮儴*/

.header {

  width: 100%;

  background: url("../images/top-bg.jpg") no-repeat;

  background-size: 100% 100%; }

  .header-top-left {

    padding: 1.5rem 0;

    margin-left: 22%;

    float: left; }

    .header-top-left img {

      width: 100%; }

.header-top-left a p{margin: 0;}
  .header-top-right {

    width: 40%;

    float: right;

    background: url("../images/top-right-bg.png") no-repeat;

    background-size: 100% 100%;

    color: #fff;

    padding: 1.5rem 3%; }

    .header-top-right span {

      padding-left: 1rem;

      line-height: 5rem;

      float: left; }

    .header-top-right-msg {

      font-family: Arial;

      display: block;

      font-size: 2.2rem;

      font-weight: bold; }

    .header-top-right-tell {

      font-size: 2.6rem;

      font-weight: 600; }

  .header-menu {

    width: 100%;

    background: #003b7d;

    border-top: 2px solid #dc0016;

    float: left;

    text-align: center; }

    .header-menu-ch, .header-menu-en {

      color: #fff;

      z-index: 2;

      transition: 1s;

      position: relative; }

    .header-menu-en {

      font-size: 1.2rem; }

    .header-menu-hover {

      background: #003b7d;

      position: absolute;

      width: 100%;

      height: 100%;

      top: 0;

      transition: 1s;

      z-index: 1; }

    .header-menu a {

      position: relative;

      width: 100%;

      padding: 1rem 0;

      display: block; }

    li:hover .header-menu-hover {

      background: #dc0016;

      transform: skewX(-20deg);

      z-index: 3; }

    li:hover .header-menu-en, li:hover .header-menu-ch {

      z-index: 200; }



#active .header-menu-hover {

  background: #dc0016;

  transform: skewX(-20deg);

  z-index: 3; }



#active .header-menu-en, #active .header-menu-ch {

  z-index: 100; }



.footer {

  background: url(../images/footerbg.jpg) no-repeat;

  background-size: 100% 100%;

  padding: 3rem 0;

  float: left; }

  .footer-logo {

    width: 20%;

    float: left;

    margin-top: 3rem; }

  .footer-message {

    width: 50%;

    float: left;

    color: #a0a0a0;

    font-size: 1.3rem;

    line-height: 2.5rem;

    margin-top: 2rem; }

    .footer-message img {

      max-width: 100%; }

  .footer-ma {

    width: 20%;

    float: right;

    margin-top: 1rem;

    max-width: 50%; }



.index-about {

  float: left;

  padding-top: 5rem;

  background: url("../images/index-about.png") no-repeat;

  background-size: 100% 100%; }

  .index-about-title, .index-product-title {

    text-align: center; }

    .index-about-title-ch, .index-product-title-ch {

      font-size: 2.6rem;

      color: #003b7d;

      font-weight: bold; }

    .index-about-title-en, .index-product-title-en {

      font-size: 2.6rem;

      color: #000; }

    .index-about-title-message, .index-product-title-message {

      color: #707070;

      font-size: 1.4rem;

      line-height: 3rem; 

      height: 6rem}

  .index-about-content {

    float: right;

    color: #707070;

    min-height: 20rem;

    font-size: 1.4rem;

    line-height: 3rem;

    margin-top: 3rem; }

  .index-about-but {

    width: 100%;

    float: right;

    margin: 3rem 0; }

    .index-about-but a {

      float: right;

      background: #dc0016;

      font-size: 1.2rem;

      padding: 1.2rem; }

  .index-about-footer {

    margin-top: 2rem;

    float: left;

    padding: 1rem 0;

    width: 100%;

    color: #fff;

    text-align: center; }

    .index-about-footer li {

      border-right: 1px solid #fff; }

    .index-about-footer li:nth-child(3) {

      border: none; }

    .index-about-footer li div {

      font-size: 2rem;

      font-weight: bold; }

      .index-about-footer-left{
        width: 50%;
        position: absolute;
        bottom: 0;
        left: 0;

      }

.index-product {

  float: left;

  padding-top: 5rem;

  background: url("../images/index-product.jpg") no-repeat;

  background-size: 100% 100%; }

  .index-product-title-message {

    line-height: 2.5rem; }

  .index-product-content {

    width: 100%;

    float: left;

    border: 1px solid #959595;

    margin: 3rem 0; }

    .index-product-content-ul {

      width: 100%; }

      .index-product-content-ul-one:hover .index-product-content-ul-one-left img {

        transform: rotate(-30deg); }

      .index-product-content-ul-one {

        background: url("../images/cpbg.jpg");

        background-size: 100% 100%;

        padding-top: 4rem; }

        .index-product-content-ul-one-left {

          padding: 3rem; }

          .index-product-content-ul-one-left img {

            width: 100%;

            transition: 1s; }

        .index-product-content-ul-one-right {

          padding: 3rem 0 6rem 0;

          writing-mode: tb-rl;

          background: url("../images/footerlogo.png") no-repeat bottom right;

          background-size: 50%; }

          .index-product-content-ul-one-right-title {

            font-size: 2rem;

            font-weight: bold; }

          .index-product-content-ul-one-right-msg {

            font-size: 1.2rem;

            margin: 0 2rem; }

      .index-product-content-ul-two li {

        border-left: 1px solid #959595;

        padding-top: 3rem;

        height: 412px;

        padding-left: 2rem;

        padding-bottom: 12rem;

        position: relative;

        z-index: 0;

        background: #fff;

        transition: 1s; }

        .index-product-content-ul-two li a {

          transition: 1s; }

      .index-product-content-ul-two li:nth-child(2) {

        z-index: 2; }

      .index-product-content-ul-two li:nth-child(3) {

        z-index: 4; }

      .index-product-content-ul-two li:nth-child(4) {

        z-index: 6; }

        .index-product-content-ul-two li:nth-child(4) .index-product-content-ul-two-msg {

          margin-bottom: 2.5rem;

          margin-right: 5rem; }

      .index-product-content-ul-two li:hover {

        background-color: #be0315;

        color: #fff; }

        .index-product-content-ul-two li:hover a {

          color: #fff !important; }

      .index-product-content-ul-two li:hover .index-product-content-ul-two-title-hover {

        display: block; }

      .index-product-content-ul-two li:hover .index-product-content-ul-two-title-image {

        display: none; }

      .index-product-content-ul-two li:hover .index-product-content-ul-two-image {

        bottom: -3rem;

        right: -1.5rem; }

      .index-product-content-ul-two li:hover .index-product-content-ul-two-image1 {

        bottom: -0rem;

        right: -1.5rem; }

      .index-product-content-ul-two-title {

        float: left; }

        .index-product-content-ul-two-title-hover {

          display: none;

          transition: 0.5s; }

      .index-product-content-ul-two-msg {

        writing-mode: tb-rl;

        font-size: 1.2rem;

        margin-right: 2rem;

        margin-top: 4rem;

        float: right;

        margin-bottom: 5rem; }

      .index-product-content-ul-two-image {

        position: absolute;

        bottom: -1rem;

        right: -3rem;

        transition: 1s; }

        .index-product-content-ul-two-image img {

          z-index: 1; }

      .index-product-content-ul-two-image1 {

        position: absolute;

        bottom: -0rem;

        right: -3rem;

        transition: 1s; }

        .index-product-content-ul-two-image1 img {

          z-index: 1; }

  .index-product-button a {

    margin-top: 5rem;

    background-color: #003b7d;

    border-color: #003b7d;

    margin-bottom: 5rem; }

.index-video-title {

  width: 100%;

  padding: 4rem 0;

  background: url("../images/video-top.jpg") center;

  background-size: 100%;

  float: left;

  position: relative; }

  .index-video-title-image {

    position: absolute;

    top: 0; }

    .index-video-title-image img {

      width: 90%; }

  .index-video-title-msg {

    float: right;

    text-align: center;

    color: #fff;

    font-size: 2rem;

    line-height: 4rem;

    padding-right: 15%; }

.index-video-content {

  width: 100%;

  padding: 13rem 0 4rem 0;

  float: left;

  background: url("../images/video-bg.jpg") no-repeat;

  background-size: 100% 100%;

  text-align: right; }

  .index-video-content img {

    width: 50%;

    margin-right: 6%; }

@media (min-width: 1400px) {

  .index-video-content {

    padding: 2rem 0; } }

.index-news {

  margin-bottom: 5rem; }

  .index-news-one {

    background: url("../images/news-bg.jpg") no-repeat;

    background-size: 100% 100%; }

  .index-news-title {

    padding: 3rem 2rem; }

    .index-news-title-en {

      font-size: 3.4rem;

      color: #fff; }

    .index-news-title-ch {

      font-size: 3rem;

      color: #fff;

      font-weight: bold; }

  .index-news-content {

    padding: 2rem;

    color: #fff;

    font-size: 1.4rem; }

  .index-news-button {

    padding: 2rem; }

    .index-news-button a {

      display: block;

      color: #fff;

      width: 30px;

      height: 30px;

      border: 1px solid #fff;

      border-radius: 50%;

      line-height: 25px;

      text-align: center;

      font-size: 2rem; }

  .index-news li:hover {

    background: #f00; }

  .index-news-box:hover .index-news-box-content-title {

    color: #fff; }

  .index-news-box:hover .index-news-box-content-msg {

    color: #fff; }

  .index-news-box:hover .index-news-box-bottom {

    color: #fff; }

    .index-news-box:hover .index-news-box-bottom a {

      color: #fff;

      border-bottom: 1px solid #fff; }

    .index-news-box:hover .index-news-box-bottom span {

      color: #fff; }

  .index-news li:hover .index-news-box-image-hover {

    background: rgba(0, 0, 0, 0.5); }

  .index-news li:hover .index-news-box-image-hover-box {

    opacity: 1;

    border-radius: 0;

    transform: translate(0, 0); }

    .index-news li:hover .index-news-box-image-hover-box img {

      transform: translate(0, 0); }

  .index-news-box {

    padding-bottom: 2rem;

    width: 100%; }

    .index-news-box-image {

      position: relative; 
		overflow: hidden;
		height: 200px;
  }
      .index-news-box-image>img{    
      	min-height: 200px;
	    min-width: 100%;
	    max-width: 200%;
	    max-height: 200px;
}
      

      .index-news-box-image-hover {

        width: 100%;

        height: 100%;

        padding: 1rem;

        background: rgba(60, 199, 220, 0);

        overflow: hidden;

        transition: 1s;

        position: absolute;

        top: 0;

        left: 0; }

        .index-news-box-image-hover-box {

          width: 100%;

          height: 100%;

          z-index: 999;

          border: 1px solid #fff;

          text-align: center;

          padding-top: 15%;

          transition: 0.5s;

          border-radius: 40%;

          opacity: 0; }

          .index-news-box-image-hover-box img {

            transform: translate(0, 100px);

            transition: 0.8s; }
    .index-news-box-content {

      padding-left: 2rem;

      font-size: 1.4rem; }

      .index-news-box-content-title {

        padding: 2rem 0;

        font-weight: bold; }

      .index-news-box-content-msg {

        color: #707070;

        overflow: hidden;

        text-overflow: ellipsis;

        white-space: nowrap; }

    .index-news-box-bottom {

      padding-top: 1rem;

      padding-left: 2rem; }

      .index-news-box-bottom a {

        color: #ff0000;

        font-size: 1.2rem;

        padding: 1rem;

        border-bottom: 1px solid #f00; }

      .index-news-box-bottom span {

        float: right;

        line-height: 3rem; }



.about-siofu-title, .cps-title {

  background: url("../images/title.jpg") no-repeat;

  background-size: 100% 100%;

  margin: 2rem 0; }

  .about-siofu-title-sf, .cps-title-sf {

    width: 130px;

    background: #dc0016;

    color: #fff;

    font-weight: bold;

    font-size: 1.8rem;

    padding-top: 0.2rem;

    padding-bottom: 0.2rem;

    text-align: center; }

    .about-siofu-title-sf span, .cps-title-sf span {

      font-size: 1rem;

      padding-right: 0.5rem; }

.about-siofu-content {

  padding: 3rem; }

  .about-siofu-content li {

    overflow: hidden;


    margin-bottom: 3rem; }

  .about-siofu-content img {

    max-height: 450px; }

.about-siofu-ftitle-sf {

  font-size: 2rem;

  font-weight: bold; }

  .about-siofu-ftitle-sf span {

    font-size: 1rem;

    color: #f00;

    padding-right: 0.5rem; }

.about-siofu-msg {

  line-height: 3rem; }

  .about-siofu-msg h {

    font-weight: bold; }



.cp {

  margin: 3rem 0; }

.cp-menu ul{margin: 0 -20px;}

  .cp-menu {

    margin-top: 3rem; }

    .cp-menu-ul li {

      text-align: center;

      padding-right: 2px; }

      .cp-menu-ul li a {

        display: block;

        height: 6rem;

        line-height: 4rem;

        width: 90%;

        background: #000;

        padding: 1rem 0;

        transition: 1s; 
        margin: 10px auto;

      }

      .cp-menu-ul li a:hover {

        background: #dc0016; }

  .cp-content ul {

    margin: 0 -3.5%; }

  .cp-content-box {

    margin: 3rem 10%;

    background: url("../images/cp-bg.jpg") no-repeat;

    background-size: 100% 100%; }

    .cp-content-box-image {

     padding: 7rem 0 4rem 0;

      text-align: center; }

      .cp-content-box-image img {

        height: 200px; }

    .cp-content-box-bottom {

      width: 100%;

      border: 2px solid #dc0016;

      float: left;

      text-align: center;

      color: #333; }

      .cp-content-box-bottom div {

        padding: 1rem 0; }

      .cp-content-box-bottom-but {

        background: #dc0016;

        color: #fff; }



.cp-gengduo{
	background: #f5f5f5;    
	padding: 1rem;
    margin-top: 3rem;
}

.content-image {

  padding-top: 6rem;

  padding-bottom: 8.4rem;

  background: url("../images/content-logo.jpg") no-repeat center top;

  background-size: 95%;

  text-align: center; }
  .content-image img{
  	height: 210px;
  }

.content-title{

background: #f5f5f5;
padding-left: 0;
}
.content-title span {

  display: block;

  background: url("../images/content-title.png") no-repeat;

  color: #fff;

  padding: 1rem; }

.content-msg {

padding-left: 0;
background: #f5f5f5;

  padding: 2rem 3rem;
min-height: 28rem;
  color: #666;

  line-height: 3rem; }



.cps-title {

  background: #fff;

  border-bottom: 1px solid #999; }

  .cps-title-sf {

    background: #fff;

    color: #000; }

    .cps-title-sf span {

      color: #dc0016; }



.news li {

  padding: 2rem; }

.news-box-image {

  position: relative;

  height: 185px;

  overflow: hidden; }

  .news-box-image-timer {

    width: 100%;

    background: rgba(0, 0, 0, 0.8);

    color: #fff;

    padding: 0.5rem 2rem;

    position: absolute;

    bottom: 0; }

    .news-box-image-timer div {

      padding-left: 3rem;

      background: url("../images/timer.png") no-repeat left;

      background-size: auto 100%; }

.news-box-title {

  font-weight: bold;

  line-height: 3rem; }

.news-box-msg {

  font-size: 1.4rem;

  color: #888; }

.news-content-title {

  text-align: center;

  font-weight: bold;

  border-bottom: 1px solid #ccc;

  padding-bottom: 3rem; }



.marketing {

  margin-top: 3rem; }

  .marketing-title {

    text-align: center;

    font-size: 2.6rem;

    font-weight: bold; }

  .marketing-keyword {

    color: #666;

    font-size: 1.8rem;

    width: 60%;

    margin-left: 20%;

    text-align: center;

    margin-top: 1rem;

    line-height: 3rem; }

  .marketing-image {

    text-align: center; }

  .marketing-content {

    color: #333;

    line-height: 3rem;

    margin-top: 2rem; }

  .marketing-national {

    margin-top: 3rem;

    margin-bottom: 3rem; }

    .marketing-national-title {

      text-align: center; }

      .marketing-national-title-en {

        font-size: 5rem;

        border-bottom: 2px solid #000;

        padding-bottom: 2.8rem;

        position: relative;

        z-index: 1; }

      .marketing-national-title-ch {

        margin-left: 37%;

        width: 26%;

        font-size: 2.8rem;

        position: relative;

        z-index: 10;

        background: #fff; }

/*  .marketing-ul {

    margin-bottom: 5rem; }*/

    .marketing-ul li {

      padding-bottom: 2rem;

      text-align: center;

      height: 260px;

      overflow: hidden;

    border: 5px solid #fff; }


.client{
	background: url(../images/service-bg.png) no-repeat center;
	background-size:100%;
	padding-bottom: 3rem;

}
.client-title {

  font-size: 2.4rem;

  font-weight: bold;

  padding-bottom: 1rem;

  padding-top: 1rem;

  border-bottom: 1px solid #c50114;

  color: #c50114;

  text-align: center; }

.client-box, .client-box1, .client-box2 {

  height: 18rem;

  margin: 2rem;

  padding-top: 2rem;

  padding-bottom: 2rem;

  text-align: center;

  background: #003b7d;

  color: #fff;

  line-height: 3rem; }

  .client-box-title, .client-box1-title, .client-box2-title {

    font-weight: bold;

    font-size: 2rem;

    padding: 1rem 0; }

.client-box1 {

  background: #000; }

  .client-box1-msg {

    width: 20%;

    margin-left: 40%; }

.client-box2 {

  background: #dc0016; }

  .client-box2-msg {

    font-size: 2.4rem; }

.client-input {

padding: 0;

  float: left;

  background: url("../images/client-bg.png") no-repeat;

  background-size: 100%;

  font-size: 1.4rem; }

  .client-input-box {

    width: 44%;

    padding: 1rem;

    background: rgba(0, 0, 0, 0.7); }

.client-input-box .former_text{
  width: 48.5%;
  display: inline-block;
}

    .client-input-box .input-group-addon{display: none}

    .client-input-box input {

      width: 100%;

      margin-left: 1%;

      margin-right: 1%;

      padding: 0.6rem 1rem;

      margin-top: 0.5rem;

      background: none;

      border: 1px solid #bbb;

      color: #fff; 
      
      float: left;
    }

    .client-input-box textarea {

      width: 97%;

      margin: 1rem 1%;

      background: none;

      border: 1px solid #e5e5e5;

      color: #fff;

      padding: 0.3rem 1rem;

      resize: none;

      height: 15rem; }

    .client-input-box button {

      width: 97%;

      margin: 0.5rem 1%;

      padding: 0.3rem 1rem;

      resize: none; }

    .client-input-box-msg {

      line-height: 3rem;

      font-weight: bold;

      color: #fff; }

      .client-input-box-msg span {

        font-weight: 100;

        font-size: 1.2rem;

        color: #a5a5a5; }



@media (max-width: 1400px) {

  #textarea {

    height: 10rem; } }

.scientific-image {

  text-align: center; }

.scientific-bottom {

  margin-top: 3rem;

  margin-bottom: 10rem;

  float: left; }

  .scientific-bottom-title {

    font-weight: bold;

    color: #df0023;

    text-align: center;

    font-size: 16px;

    margin-top: 3rem; }

  .scientific-bottom li {

    margin-right: 3rem;

    float: left; }

  .scientific-bottom-box {

    margin-top: 3rem;

    margin-left: 3rem; }

    .scientific-bottom-box div {

      float: left;

      margin-left: 1rem;

      font-size: 1.4rem;

      line-height: 2rem; }



.scientific-nav {

  font-size: 1.4rem;

  background: #c50114;

  padding: 1rem;

  color: #fff;

  margin-bottom: 2rem; }

  .scientific-nav a {

    color: #fff; }



body {

  font-size: 14px;

  font-family: "Microsoft YaHei"; }



ul {

  margin: 0;

  padding: 0; }



ul li {

  list-style: none; }



.phone-bg {

  background: url("../images/phone-index-bg.png") no-repeat;

  background-size: 100%; }



.index-top {

  background: url("../images/phone-bg.jpg") no-repeat;

  background-size: auto 100%;

  position: relative; }



.index-top i {

  position: absolute;

  top: 15px;

  right: 20px;

  color: #dc0016;

  font-size: 1.8rem; }



.am-margin-top-md {

  margin-top: 2rem; }



.am-offcanvas-bar {

  width: 200px; }



.am-offcanvas-content {

  padding: 5px 0; }



.am-offcanvas-content ul li a {

  display: block;

  line-height: 40px; }



.am-offcanvas-content ul li a.active, .am-offcanvas-content ul li a:hover {

  background: #222; }



.index-two {

  padding: 20px 30px; }



.index-two ul li {

  margin: 10px 0; }



.index-two ul li a {

  color: #000;

  display: block; }



.index-two ul li a .img {

  width: 70%; }



.index-two-border {

  height: 10px;

  background: #ececec; }



.footer {

  background: #051121;

  border-top: 4px solid #b40010; }



.in-message li {

  background: #000;

  padding: 1rem 0;

  border-right: 2px solid #e9be07; }

  .in-message li div {

    color: #e9be07; }

  .in-message li span {

    color: #fff;

    font-size: 1.6rem;

    font-weight: bold; }

.in-message li:nth-child(3) {

  border-right: none; }



.phone-product-title {

  text-align: center;

  font-size: 1.4rem; }

  .phone-product-title div {

    font-size: 3rem;

    font-weight: bold; }



.phone-product-content {

  margin-top: 3rem; }



.phone-product-content-box-title {

  padding-top: 2rem;

  font-size: 1.8rem;

  font-weight: bold; }



.phone-product-content-box {

  line-height: 2.5rem; }



.phone-product-but button {

  width: 80%;

  padding: 0.5rem 0;

  background: #003b7d;

  margin: 2rem 10%;

  border-radius: 5px; }



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