.cs_w{width: 66%; margin: auto;}
.cs_w_90{width: 90%; margin: auto;}
.cs_w_80{width: 80%; margin: auto;}
.cs_w_70{width: 70%; margin: auto;}
.cs_w_60{width: 60%; margin: auto;}
.cs_w_50{width: 50%; margin: auto;}
.web_main{width: 100%; position: relative; z-index: 9;}
.web_main:before{position: absolute; top: 10%; content: ""; width: 100%; height: 90%; background: linear-gradient(360deg, rgba(255, 255, 255, 0.2) 80%, transparent);backdrop-filter: blur(8px);}
.web_main h2{font-size: 4rem; line-height: 5rem;}
body .btn,body .s_btn{padding-top: 11px!important;padding-bottom: 11px!important; min-width: 140px;}
/*.en.index h2{line-height: 4.5rem!important;}*/
/*.en.index h3{line-height:3.2rem!important;}*/
/*@media (max-width:990px) {*/
/*    .en h1{line-height: 5rem!important;}*/
/*    .en h2{line-height: 4.2rem!important;}*/
/*}*/

@media (max-width:1600px) {
    .cs_w_90,.cs_w_80,.cs_w_70,.cs_w_60,.cs_w_50,.cs_w{width: 90%!important;}
}
@media (max-width:990px) {
    .cs_w_90,.cs_w_80,.cs_w_70,.cs_w_60,.cs_w_50,.cs_w{width: 80%!important;}
    .cons.table:before{content: ""; width: 100vw; height: 100vh; position: absolute; left: 0; top: 0; background: linear-gradient(rgba(7, 27, 56, 0.4),rgba(7, 27, 56, 0.7))}
}
.vh{min-height: 900px; height: 100vh}
@media (max-height: 990px) {
    .vh{min-height: 100vh;}
}

/*body .bo_back{background:#fff url("../images/body_back.jpg") top center no-repeat; background-size: cover; height: 1067px; position: absolute; top: 0; left: 0; width: 100%; z-index: 0}*/
body .bo_back{height: 100vh; position: fixed; top: 0; left: 0; width: 100%; overflow: hidden; z-index: -9; background: url("../images/index/001.jpg") center no-repeat; animation: 15s ease 0s infinite back_bri1;}
body .bo_back>div{animation: 10s ease 0s infinite back_bri0; width: 100%; height: 100%;}
body .bo_back i{ width: 800px; height: 800px; position: absolute; border-radius: 999px;}
body .bo_back i.a{background: radial-gradient(circle, rgba(39, 193, 112, 0.2) 30%, #fff0, #fff0); position: absolute; top: 15%; left: -25%; animation-delay: 3s}
body .bo_back i.b{background: radial-gradient(circle, rgba(39, 117, 220, 0.2) 30%, #fff0, #fff0); position: absolute; top: -50%; left: 10%;}
body .bo_back i.c{background: radial-gradient(circle, rgba(119, 222, 218, 0.2) 30%, #fff0, #fff0); position: absolute; top: -20%; right: -25%; animation-delay: 5s}
body .bo_back>div{background: url("../images/index/banner_back.svg") center no-repeat; background-size: 160%;animation:30s ease infinite back_bri2;}
/*@keyframes back_bri0{*/
/*    0%{transform: rotate(0deg)}*/
/*    50%{transform: rotate(20deg)}*/
/*    100%{transform: rotate(0deg)}*/
/*}*/
@keyframes back_bri2{
    0%{background-position: center -180px}
    50%{background-position: center}
    100%{background-position: center -180px}
}
@keyframes back_bri1{
    0%{background-position: center top}
    50%{background-position: right top}
    100%{background-position: center top}
}

.header{padding: 20px 0; z-index: 999; position: relative;}
.header li{align-self: center}
.header li a{color: #222; padding:10px 20px}
.header li a:hover{color: #00a94d}
.child .header{background: #fff}
@media (max-width: 550px) {
    .header{background: #fff}
}
@media (max-width: 1550px) {
    .header li a{padding: 10px 15px}
}
@media (max-width: 1350px) {
    .header .menu.c{position: fixed; z-index: 999; right: 10%}
    .header .menu{width: 30px; height: 30px; position: relative; cursor: pointer;border-top: 4px solid #00a94d;border-bottom: 4px solid #00a94d; z-index: 999}
    .header .menu:before{content: ""; display: block; height: 4px; width: 100%; background: #00a94d; margin-top: -2px;position: absolute; left: 0; top: 50%;}
    .header .menu:before,.header .menu:after{transition: all .3s ease}
    .header .menu:after{transform: rotate(0deg); content: ""}
    .header .menu.c:before,.header .menu.c:after{content: ""; display: block; height: 4px; width: 100%; background: #00a94d; z-index: 999;position: absolute; left: 0; top: 0;}
    .header .menu.c:before{transform: rotate(45deg); top: 2px}
    .header .menu.c:after{transform: rotate(-45deg);}
    .header .menu .list{display: none}
    .header .menu ul{display:block!important; position: fixed; z-index:99; width: 100vw;height: 100vh;left: 0; top: 0; background: rgba(0, 0, 0, 0.9);padding-top: 90px;}
    .header .menu li{width: 100vw; height: 10vh; border-bottom: 1px solid rgba(255, 255, 255, 0.3);display: flex;align-items: center;}
    .header .menu li .a{padding:20px 0!important;color: #fff; width: 100%; display: inline-block;}
}

.web_banner{position: relative; z-index: 99;}
.web_banner h1{font-size: 4.5rem; line-height: 5.2rem}
.web_banner .pic{padding: 40px 0}
.web_banner .pic img {
    animation: 5s ease-in-out 0s infinite pic;
    position: relative;
    max-width: 100%;
}
@media (min-width: 550px) {
    .header li:last-child a{border: 1px solid #555; padding: 5px 20px; margin-left: 10px; border-radius: 99px; transition: all .3s ease}
    .header li:last-child a:hover{border-color: #00a94d; background: #00a94d; color: #fff}
    .web_banner .font{padding-left: 120px;}
}
@media (max-width: 550px) {
    .web_banner .pic{order: 0}
    .web_banner .font{order: 1; padding-bottom: 100px;}
}
@keyframes pic{
    0%{top: 0; left: 0}
    50%{top: 20px; left: 10px}
    100%{top: 0; left: 0}
}

.web_main>div{padding: 100px 0; position: relative; z-index: 99}
.web_main>div .font,.web_main>div .pic{position: relative; z-index: 99}
.web_main>div img{max-width: 100%;}

/*.web_main>div .pic{filter: drop-shadow(5px 5px 20px rgba(21, 73, 46, 0.1));}*/
.b_g{position: absolute; top: -8%; width: 100%; height: 200%; z-index: 1; overflow: hidden}
.b_g .back{background: rgba(255, 255, 255, 0.5); position: relative; top:8%; left: -8%; width: 150%; height: 50%; transform: rotate(3deg);backdrop-filter: blur(5px);}
.b_g .back_r{background: rgba(255, 255, 255, 0.5); position: relative; top:3%; left: -8%; width: 150%; height: 50%; transform: rotate(-3deg);backdrop-filter: blur(5px);}
.top .font{padding-top: 80px;}
.top_a .b_g{top:-10%;}
@media (max-width: 550px) {
    .web_main > div .font>div{width: 100% !important;}
    .web_main .btn{width: 100%;}
    .web_main>div .pic{order: 0}
    .web_main>div .font{order: 1; padding-top: 0!important;}
    .b_g .back,.b_g .back_r{top: 5%}
}
.con02 .pic img {
    animation: 5s ease 0s infinite ho21;
    position: relative;
    animation-delay: 0.5s;
}
@keyframes ho21{
    0%{left: 0;}
    35%{left: -15px;}
    66%{left: 15px;}
    100%{left: 0;}
}

.blog_section_child{background: rgba(255, 255, 255, 0.6);}
.blog_section_child .flex{padding-top: 80px;}
.blog_section_child .flex>div{position: relative; margin-bottom: 20px}
.blog_section_child .flex>div h4{position: absolute; bottom: -20px; padding:15px 20px; background: #fff; color: #222; width: 100%; transition: all .3s ease}
.blog_section_child .flex>div:hover h4{padding: 20px;}

.footer{padding: 70px 0; background: #fff; position: relative}
.footer li{display: inline-block}
.footer li a{padding: 0 12px; color: #555}
.footer li a:hover{color: #00a94d}

/*suspension_right*/
.suspension_right{position: fixed; right: 15px; bottom: 80px; z-index: 30}
.suspension_right ul{text-align: right;flex-wrap: wrap-reverse;}
.suspension_right li{width: 38px; height: 38px; text-align: center; margin-top: 10px; cursor: pointer;}
.suspension_right li a{display: inline-block; width: 100%; height: 100%; line-height: 3.8rem; background: #ccc; border-radius: 90px; cursor: pointer; opacity: 0.5; color: #fff}
.suspension_right li a:hover{color: #fff; opacity: 1}
.suspension_right li.ac{width: 69px; height: 64px;}
.suspension_right li.wx .qr img{width: 125px;}
.suspension_right li.wx .qr{position: absolute; top: 250px; right: 60px; transition: all .3s ease; z-index: 1; opacity: 0; border-radius: 3px; border: 1px solid #ccc}
.suspension_right li.wx:hover .qr{top: -30px; opacity: 1;}
.suspension_right li.wx a:hover,.suspension_right li.top a:hover{background-color: rgba(0,169,77,1)}
@media (max-width: 550px) {
    .suspension_right{display: none}
}