body {
	font-size: 16px;
	color: #333;
}
.sidebar *,
header *,
footer *,
main *{
    
    transition: all .3s linear;
}
.font,
h1{
    font-weight: normal;
    
	font-family: "cooper";
}
@font-face {
	font-family: "cooper";
	src: url("../font/CooperBlack.ttf");
}
@font-face {
  font-family: 'iconfont';
  src: url('iconfont.woff2?t=1736226569730') format('woff2'),
       url('iconfont.woff?t=1736226569730') format('woff'),
       url('iconfont.ttf?t=1736226569730') format('truetype');
}
.iconfont {
  font-family: "iconfont" !important;
  /*font-size: 16px;*/
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.head{
    height: 156px;
}
header{
        position: fixed !important;
    top: 0;
      z-index: 9999;
}
header .head1{
}
header.bgcolor{

    background: #fff;
    box-shadow: 0px 0px 12px 0px rgba(241, 1, 128, 0.2);
  
}
header.bgcolor .header_top{
    height: 0;
    padding: 0;
    overflow: hidden;
}
header.bgcolor .head1{
    /*position: fixed;*/
    /*top: 0;*/
    /*left: 0;*/
    /*z-index: 9999;*/
   
}
.header_top{
    background: #000000;
    padding: 15px 0;
    color: #fff;
}

.header_top ul a{
    transition: all 0.3s linear;
}
.header_top ul a:hover{
    color: var(--ftc);
}
.search{
    padding: 10px 20px;
    border-radius: 25px;
border: 1px solid #333333;
max-width: 200px;
}
.search input{
    background: initial;
}
.search button{
    background: initial;
}
.layui-nav .layui-nav-item a{
    color: #333;
    padding: 0;
    white-space: nowrap;
    font-size: 22px;
    padding: 0 20px;
}
.layui-nav .layui-icon-down:before{
    
    content: "\e625";
}
.layui-nav-child{
    left: 0;
    transform:none !important;
    padding: 23px 0;
    max-height:80vh;
    overflow:hidden;
    overflow-y: auto;
}
.layui-nav-child a{
    font-size: 18px;
    padding: 10px 33px !important;
}
.layui-nav .layui-nav-item a:hover, .layui-nav .layui-this>a{
    color: var(--ftc);
}
.layui-nav .layui-this:after, .layui-nav-bar{
    display: none;
}
.footer1 .hr{
    width: 424px;
    max-width: 100%;
    background: rgba(255,255,255,0.5);
    height: 1px;
}
.footer_icon a{
    color: #1F1F1F;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    aspect-ratio: 1/1;
}
.footer_icon a:hover{
    background: var(--ftc);
    color: #fff;
}
.footer_nav a:hover{
    color: var(--ftc);
}
.sidebar{
    z-index: 9999;
    position: fixed;
    right: 10px;
    top: 40%;
}
.sidebar a{
    display:flex;
    align-items: center;
    justify-content: center;
    width:42px ;
    aspect-ratio: 1/1;
    background:#1F1F1F ;
    color: #fff;
    border-radius: 50%;
    box-shadow:     0px 0px 12px 0px rgba(241, 1, 128, 0.2);

}
.sidebar li{
    position: relative;
}
.sidebar li:hover a{
    background: #E4A8DC;
}
.sidebar li .b1{
    position: absolute;
    right: 100%;
    top: 0;
    opacity: 0;
    width: 0;
    overflow: hidden;
}
.sidebar li:hover .b1{
    width: auto;
    opacity: 1;
}
.topbanner{
    width: 100%;
    aspect-ratio: 1920/640;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background: none;
}
.contact_info li{
    box-shadow: 0px 2px 6px 0px rgba(103,0,55,0.15);
}
.contact_info li:hover{
    box-shadow: 0px 0px 12px 0px rgba(241, 1, 128, 0.2);
    
}
.contact_content {
    width: 550px;
    max-width: 100%;
}
.contact-form{
    background: #F5F5F5;
    padding: 40px 80px;
}
.form_item{
    position: relative;
}
.form_item canvas{
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}
.faq_list li{
    
border-radius: 4px;
overflow: hidden;border: 1px solid #E1E1E1;
}
.faq_list h2{
    font-size: 24px;
    padding: 12px 24px;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s;
}
.faq_list h2 i{
    color: #000;
    font-size: 18px;
}

.faq_list li:hover t1,
.faq_list li:hover h2,
.faq_list .active t1,
.faq_list .active h2{
    color: var(--ftc);
}
.faq_list .content_box{
    display: none;
    padding: 12px 24px;
}
.faq_list .content_box {
    line-height: 30px;
}
.faq_list .active .layui-icon:before{
    
    content: "\e67e";
}
.faq_list h2:hover,
.faq_list .active h2{
    
    background: #F6F6F6;
}
.blog_ul .img_100{
    aspect-ratio: 870/521;
}
.blog_ul a:hover .t1{
   color: var(--ftc);
}
.blog_title{
    font-size: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    text-align: center;
    margin-bottom: 20px;
}
.blog_title i{
    width: 30px;
height: 2px;
background: #303030;
}
.blog {
    --main:1100px
}
.nav1 a:hover{
    color: var(--ftc);
}
.search1{
 border-bottom: 1px solid #CFCFCF;   

 padding: 10px 5px 10px 30px;
}
.search1 button{
    background: initial;
}
.search button:hover,
.search1 button:hover{
    scale: 1.1;
    
}
.blog_tody .img_100{
    width: 70px;
    aspect-ratio: 1/1;
}
.blog_nav{
  position: sticky;
    top: 120px;  
}
.about_pic .img_100{
    aspect-ratio: 1/1;
}
.s_content *{
    
    text-wrap-mode: wrap !important;
}

.serive_made li{
    padding: 40px 10px;
    background: #F5F5F5;
}
.serive_process li .img2,
.serive_made li .img2{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: -1;
    opacity: 0;
}
.serive_made li .img_box{
    position: relative;
}
.serive_made li:hover {
    background: var(--ftc);
    color: #fff;
}
.serive_made li:hover  .img1{
    opacity: 0;
}
.serive_made li:hover  .img2{
    opacity: 1;
    z-index: 1;
}

.serive_process{
    background-repeat: no-repeat;
   background-size: auto;
    background-position: center 50px;
}
.serive_process li:hover  .img1{
    opacity: 0;
}
.serive_process li:hover  .img2{
    opacity: 1;
    z-index: 1;
}
.serive_process li:hover {
    color: var(--ftc);
}
.serive_process li:nth-child(even){
    margin-top: 80px;
}
.serive_process li .img_box{
    bottom: 0;
}
.serive_process li:hover .img_box{
    bottom: 20px;
}
.serive_contact{
    background: #F8F8F8;
}
.serive_contact form{
        display: grid;
        gap: 10px ;
          /* 宽度平均分成4份 */
        grid-template-columns: repeat(12,1fr);
        /* 高度平均分成3份 */
        /*grid-template-rows: repeat(4,1fr);*/
        grid-ar
}
.serive_contact form>*:nth-child(1){
    
    grid-area: 1 / 1 / span 1 / span 4;
}

.serive_contact form>*:nth-child(2){
 
    grid-area: 1 / 5 / span 1 / span 4;
     
}
.serive_contact form>*:nth-child(3){
    grid-area: 1 / 9 / span 1 / span 4;

}
.serive_contact .textarea{
    grid-area: 2 / 1 /span 3 / span 6;
}
.serive_contact .textarea textarea{
    height: 100%;
}
.serive_contact .country{
    
    grid-area: 2 / 7 / span 1 / span 6;
}.serive_contact .captcha{
    
    grid-area: 3 / 7 / span 1 / span 6;
}
.serive_contact .btn{
    
    grid-area: 4 / 7 / span 1 / span 6;
}
.serive_contact .layui-input, .serive_contact .layui-textarea{
  background: #F1F1F1;
  border:1px solid #BBBBBB;
}
.s_content{
    font-size: 18px;
    line-height: 1.8em;
}
.product_ul .img1{
    aspect-ratio: 1/1;
    width: 320px;
    transition: all 0.3s linear;
    box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0);
}

.product_ul .img1:hover{
    
    box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
}
.product_ul .subtitle{
    min-height: 5.4em;
}
.pagenum{
    margin-top: 80px;
}
.pagenum a, .pagenum span{
   background: #EBF4FC;
   border: none;
   color: #121D55;
}
.layui-btn-parimy{
    background: #F5F5F5;
    color: #666;
}
.layui-btn-parimy:hover{
    color: #666;
}
.product{
    --btn:50px
}
.mySwiper {
    max-width: 150px;
    max-height: 503px;
    overflow: hidden;
}
    .mySwiper .swiper-slide  {
       
        aspect-ratio: 1/1;
        height: 150px;
        border: 1px solid #CCCCCC;
    }
    .mySwiper {
       
    }
    .button-next,
    .button-prev {
        cursor: pointer;
        flex-shrink: 0;
    }

    .product_pic {
        max-width: 520px;
        width: 520px;
        aspect-ratio: 1/1;border: 1px solid #CCCCCC;
    }
    .product_box{
        display: grid;
        gap: 10px;
        align-items:center;
        grid-template-columns: 1fr 166px;
        height: 521px;
    }
      .product_box .mySwiper2{
          height: 100%;
          --swiper-navigation-color:var(--ftc);
      }
      .mySwiperThum .swiper-slide{
          border: 1px solid #ccc;
      }
      .mySwiperThum .swiper-slide-thumb-active{
          border-color:var(--ftc);
      }
.product hr{
    width: 60px;
    border-bottom: 3px solid var(--ftc);
}
.product_about{
    position: relative;
}
.product_about i{
    font-size: 50px;
    color: #333;
    position: absolute;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
display: block !important;
    
}
.product_about i:hover{
    color: var(--ftc);
}
.product_about i.prev{
    right: calc(100% + 20px);
    
}.product_about i.next{
    left: calc(100% + 20px);
}
.product_about_swiper .img1{
    aspect-ratio: 1/1;
}
.index_service li:not(:last-child)::after{
        content: "";
    position: absolute;
    right: 0;
    top: 10px;
    height: 138px;
    width: 1px;
    background-color: rgba(51, 51, 51, .1);
}
.index_service li:hover .img1{
    scale: 1.1;
}
.index_service .img1{
    max-width: 100%;
    overflow: visible;
    height: 80px;
    
}
.index_product .item{
    background: #F8F8F8;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.1);
border-radius: 18px;
background: #fff;
overflow: hidden;
    margin: 16px 16px;
}
.index_product .item .img1{
    aspect-ratio: 326/368;
}
.index_product .item:hover{
    background: var(--ftc);
    color: #fff;
}
.index_advan{
    width: 1000px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}
.index_advan li{
    position: relative;
}
.index_advan .img1{
    width: 70px;
}
.index_advan .item:hover .img1{
    scale: 1.1;
}
.index_advan li:not(:last-child)::after{
    display: block;
    content: '';
    height: 2px;
background: #FFE1FB;
box-shadow: 0px 1px 0px 0px #F2F2F2;
    box-shadow: 0px 1px 0px 0px #F2F2F2;
  
}
.index_ab{
  padding: 160px 0;
}
.index_ab .img_box{
    overflow: visible;
}
.index_ab li:hover .item{
   scale: 1.1;
    
}
.index_ab li{
    position: relative;
}
.index_ab li:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 10px;
    height: 65px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    background-color: rgba(255, 255, 255, .9);
}
.index_ab1 .swiper_box{
    width: 45%;
    position: absolute;
  height: 500px;
    left: 0;
}
.survey_nr_tt .label1{
    border: 1px solid #999;
    border-radius: 30px;
    padding: 10px 20px;
    font-size: 20px;
    min-width: 190px;
    text-align: center;
}
.survey_nr_tt .label1.active,
.survey_nr_tt .label1:hover{
    border-color:var(--ftc);
    background: var(--ftc);
    color: #fff;
    
}
.survey_nr_tt .label1.active button,
.survey_nr_tt .label1:hover button{
    
    color: #fff;
}
.survey_nr_tt .label1 button{
    background: initial;
    color: initial;
}
.index_ab1 {
    --swiper-pagination-bullet-width:16px;
    --swiper-pagination-bullet-height:16px;
    --swiper-pagination-bullet-inactive-color:#fff;
    --swiper-pagination-bullet-inactive-opacity:1;
    --swiper-pagination-color:#E4A8DC;
    --swiper-pagination-bullet-horizontal-gap:8px
}
.index_ab1 .layui-main{
    position: unset;
}
.index_ab1 .swiper-pagination-bullet{
 border: 3px solid #E4A8DC;
}
.index_ab1 .swiper-pagination{
    text-align: right;
}
.index_ab1 .content_box{
   width: 50%;
   margin-left: auto;
    font-size: 20px;
    line-height: 1.8em;
   height: 500px;
   overflow: hidden;
   overflow-y: auto;
}
.index_ab1 li:nth-child(even) .content_box{
    margin-left: 0;
    margin-right: auto;
}
.index_ab1 li:nth-child(even) .swiper_box{
    left: unset;
    right: 0;
}
.contact_dialg{
    padding: 20px;
}
.contact_dialg form{
    width: 500px;
    margin: 0 auto;
    max-width: 100%;
}
.contact_dialg .layui-textarea{
    height: 100px !important;
}

.index-pagin{
    --swiper-pagination-color:var(--ftc);
    --swiper-pagination-bottom:-30px;
}

@media only screen and (max-width: 1400px) {
}

@media only screen and (max-width: 990px) {
}

@media only screen and (max-width: 768px) {
    header,
    footer,
    main{
        zoom: 0.7;
    }
    .header_top {
        padding: 5px 0;
    }
    .header_top .layui-main{
       justify-content: center;
    }
.contact-form{
    background: #F5F5F5;
    padding: 30px;
}
.layui-nav-item {
    padding-left: 1em;
}
.serive_process{
    background: unset !important
    ;
}
    .index_service li:nth-child(2n+2):after{
        display: none;
    }
    .index_ab1 .content_box{
        width: 100%;
        margin-top: 20px;
        height: auto;
        overflow: visible;
    }
    .index_ab1 .swiper_box{
        width: 100%;
        height: auto;
        
        position: unset;
    }
    .index_ab li:not(:last-child)::after{
        display: none;
    }
    .product_about i{
        display: none !important;
    }
  .indexPic .item{
      padding-left: 20px;
      justify-content: flex-start;
      
  }
   .indexPic .item .img_box{
       width:32px;
   }
}

@media only screen and (min-width: 751px) and (max-width: 1400px) {
}

@media only screen and (min-width: 751px) {
}