@media (max-width: 997px) {
    .container {
        overflow: hidden;
    }
    .header {
        padding: .8rem .75rem;
        height: 3.25rem;
    }
    .header.on {
        background: #000;
    }
    .header .logo {
        width: 4.35rem;
        padding: 0;
    }
    .header .nav {
        display: none;
    }
    .header .hr {
        display: none;
    }
    .header .side-btn {
        display: block;
        width: 1.25rem;
        height: 100%;
        position: relative;
    }
    .header .side-btn .img-box,
    .header .side-btn .close{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 0;
        width: 1.25rem;
        height: .9rem;
        transition: all .5s;
    }
    .header .side-btn .close {
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        opacity: 0;
    }
    .header .side-btn .img-box.on {
        opacity: 0;
    }
    .header .side-btn .close.on{
        opacity: 1;
    }
    .header .side-btn .img-box svg {
        width: 1.25rem;
        height: .9rem;
    }
    .header .side-btn .close .line {
        width: 100%;
        height: .05rem;
        border-radius: .05rem;
        background: #fff;
        transition: all .5s;
    }
    .header .side-btn .close.on .line:nth-child(1) {
        transform: rotate(45deg);
    }
    .header .side-btn .close.on .line:nth-child(2) {
        transform: rotate(-45deg);
    }
    .header .mb-list {
        position: absolute;
        top: 3.25rem;
        left: 0;
        width: 100%;
        background: #000;
        display: none;
        flex-direction: column;
        padding: 1rem .75rem;
    }
    .header .mb-list .items {
        display: flex;
        flex-direction: column;
        padding: 1rem 0;
    }
    .header .mb-list .items .title {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .header .mb-list .items ul {
        /*display: flex;*/
        flex-direction: column;
        display: none;
        margin-top: 1rem;
        padding-left: .75rem;
        gap: .4rem;
    }
    .header .mb-list .items ul li a {
        color: #fff;
        opacity: .6;
    }
    .header .mb-list .items .title .img-box {
        width: .6rem;
        height: .6rem;
        transition: transform .5s;
        display: flex;
        align-items: center;
        transform-origin: 50% 50%;
    }
    .header .mb-list .items .title .img-box.on {
        transform: rotate(45deg);
    }
    .index1 .swiper-container,
    .banner1 .swiper-container{
        height: 15rem;
    }
    .banner1 .swiper-container .swiper-wrapper .swiper-slide .pc {
        display: none;
    }
    .banner1 .swiper-container .swiper-wrapper .swiper-slide .mb {
        display: block;
    }
    .banner1 .swiper-container .swiper-wrapper .swiper-slide .text .btn-box button {
        width: auto;
        height: auto;
    }
    .banner1 .swiper-container .swiper-wrapper .swiper-slide .text .btn-box button a {
        padding:.24rem 2.25rem;
    }
    .index2 {
        padding: 3.25rem 0 0;
    }
    .index2 .swiper-container {
        height: auto;
    }
    .index2 .swiper-container .swiper-wrapper {
        gap: 0;
    }
    .index2 .swiper-container .swiper-wrapper .swiper-slide {
        width: 100%;
        height: 8.6rem;
    }
    .index2 .swiper-container .swiper-wrapper .swiper-slide img,
    .index2 .swiper-container .swiper-wrapper .swiper-slide video {
        width: 100%;
        height: 100%;
    }
    .index2 .swiper-container .btn svg {
        top: 50% !important;
        transform: translateY(-50%);
    }
    .index2 .swiper-container .btn svg.prev {
        left: .75rem;
    }
    .index2 .swiper-container .btn svg.next {
        right: .75rem;
    }
    .index2 .swiper-container .swiper-pagination {
        display: none;
    }
    .index2 .nav-swiper {
        display: block;
        padding: 0 .75rem;
        margin-top: 1rem;
    }
    .index2 .nav-swiper .swiper-wrapper .swiper-slide .item{
        border-radius: 0;
        display: flex;
        flex-direction: column;
        cursor: pointer;
        border-top: 1px solid #555;
        padding-top: .5rem;
    }
    .index2 .nav-swiper .swiper-wrapper .swiper-slide .item span {
        color: rgba(255, 255, 255, .7);
        margin-top: .75rem;
        text-align: left;
    }
    .index2 .nav-swiper .swiper-wrapper .swiper-slide .item p {
        color: rgba(255, 255, 255, .7);
        margin-top: .4rem;
        text-align: left;
    }
    .index2 .nav-swiper .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .item {
        border-top: 1px solid #26ABD6;
    }
    .index2 .nav-swiper .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .item span {
        color: #26ABD6;
    }
    .index2 .nav-swiper .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .item p {
        color: #fff;
    }
    .index3 {
        padding: 3.25rem .75rem;
    }
    .index3 .card .item:nth-child(1) {
        flex-direction: column;
    }
    .index3 .card .item:nth-child(1) .title {
        padding: .75rem;
        text-align: center;
        gap: .5rem;
        height: auto;
    }
    .index3 .card .item:nth-child(1) .img-box {
        width: 100%;
        height: 100%;
    }
    .index4 {
        height: 24rem;
    }
    .index4 .swiper-box {
        height: 100%;
        bottom: 0;
        top: inherit;
    }
    .index4 .swiper-box .swiper-container .swiper-wrapper .swiper-slide a {
        left: 50%;
        transform: translateX(-50%);
        width: auto;
        height: auto;
        border-radius: .1rem;
        padding: .24rem .32rem;
        bottom: .75rem;
    }
    .index4 .swiper-box .swiper-container .btn {
        top: 50%;
        transform: translateY(-50%);
        padding: 0 .75rem;
    }
    .index4 .nav {
        flex-wrap: wrap;
        justify-content: flex-start;
        padding: .75rem;
        gap:1rem .6rem;
    }
    .index5 {
        width: 100%;
        height: auto;
        padding: 3.25rem .75rem;
    }
    .index5>img.img-item {
        display: none;
    }
    
    
    .d1 {
        padding: 0;
        margin-top: 3.25rem;
    }
    .d1 ul li {
        flex-direction: column-reverse !important;
    }
    .d1 ul li .text {
        text-align: center;
    }
    .d1 ul li .text p {
        line-height: 150%;
    }
    .d1 ul li .img-box {
        margin-top: 1.75rem;
    }
    .d1 ul li .img-box img,
    .d1 ul li .img-box video {
        height: 10.925rem;
    }
    .d2 .main {
        padding: 0 .75rem;
    }
    .d2 .main .rg .img-box {
        height: auto;
    }
    .d3 {
        padding: 0;
        margin-top: 3.25rem;
    }
    .d3 .title {
        width: 100%;
        display: flex;
        justify-content: center;
        margin-bottom: 1.5rem;
    }
    .d3 .title span{
        width: 11.4rem;
    }
    .d3 .list {
        gap: 1.25rem;
    }
    .d3 .list span {
        text-align: center;
    }
    .d3 .list .btn {
        padding-left: 1.5rem;
    }
    .d3 .list .swiper-container .swiper-wrapper .swiper-slide {
        width: auto;
        height: auto;
        gap: .75rem;
    }
    .d3 .list .swiper-container .swiper-wrapper .swiper-slide .img-box {
        width: 15.625rem;
        height: 9.975rem;
    }
    .d4 .title {
        padding: 0 1.5rem;
        margin-bottom: 2.5rem;
    }
    .d4 .swiper-container .swiper-wrapper .swiper-slide {
        padding: 0;
    }
    .d4 .swiper-container .swiper-wrapper .swiper-slide .btn-box a {
        padding: .3rem 2.25rem;
        width: auto;
        height: auto;
    }
    .d4 .swiper-container .swiper-wrapper .swiper-slide .btn-box a::after {
        width: .65rem;
        height: .45rem;
    }
    .d4 .swiper-container .swiper-pagination ul .item.active::after {
        top: 1.58rem;
    }
    .d4 .swiper-container .swiper-wrapper .swiper-slide img,
    .d4 .swiper-container .swiper-wrapper .swiper-slide video {
        left: 0;
        width: 100%;
    }
    .four1 {
        height: 16rem;
    }
    .four1 .pc {
        display: none;
    }
    .four1 .mb {
        display: flex;
        flex-direction: column;
        position: absolute;
        bottom: 0;
    }
    .four2 .main {
        flex-direction: column-reverse;
        gap: 1rem;
        padding: 0;
    }
    .four2 .main .lf .list2 {
        height: auto;
        width: 100%;
        padding: .75rem;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .four2 .main .lf .list1 .item {
        width: 8.35rem;
    }
    .four2 .main .lf .list2 .swiper-wrapper {
        flex-wrap: nowrap;
        gap: 0;
    }
    .four2 .main .lf .list2 .swiper-wrapper .swiper-slide {
        height: auto;
    }
    .four2 .main .lf .list2 .swiper-wrapper .swiper-slide .item{
        height: 7.5rem;
    }
    .four3 .main {
        padding: 1rem 0 0;
    }
    .four3 .main>div {
        height: auto;
        flex-direction: column;
    }
    .four3 .main>div .lf {
        width: 100%;
    }
    .four3 .main>div .rg {
        padding: 1.5rem .75rem;
    }
    .four3 .main>div .rg ul {
        gap: 1rem 1.5rem;
        margin-top: 1.5rem;
    }
    .four3 .main>div .rg ul li {
        width: 4.7rem;
    }
    .four3 .main>div .rg .text span {
        font-size: .8rem;
    }
    .four4 .main ul {
        flex-direction: column;
        padding:0 .75rem;
        gap: .75rem;
    }
    .four4 .main ul li {
        width: 100% !important;
        height: 10.2rem;
    }
    .four4 .main ul li span {
        font-size: .75rem;
    }
    .four5 {
        margin-top: 1.75rem;
        height: 30.525rem;
    }
    .four5 img {
        height: 20%;
        position: absolute;
        bottom: 0;
        object-fit: cover;
    }
    .four5 .tb-box {
        width: 100%;
        right: 0;
        height: auto;
    }
    .news2 {
        margin-top: 3.25rem;
        padding: 0;
    }
    .news2 .top {
        flex-direction: column;
        gap: 1rem;
    }
    .news2 .top .rg p {
        line-height: normal;
    }
    .news2 .top .rg a {
        margin-top: 1rem;
    }
    .news2 .list {
        margin-top: 0;
        padding: 3.25rem .75rem;
    }
    .news2 .list .item {
        width: 100%;
        height: auto;
    }
    .news2 .list .item .text span.title {
        height: auto;
    }
    .new-det {
        padding: 4.15rem .75rem 3.25rem;
        flex-direction: column;
    }
    .new-det .lf {
        width: 100%;
        padding: 0;
    }
    .new-det .lf .top .share>div ul li {
        width: 1.2rem;
        height: 1.2rem;
    }
    .new-det .lf .main {
        padding: 0 .75rem;
    }
    .new-det .rg .list {
        width: 100%;
    }
    .new-det .rg .list2 a.back::after {
        width: .65rem;
        height: .6rem;
    }
    .pd1 {
        padding: 0 .75rem;
    }
    .pd1 .title p {
        width: auto;
    }
    .pd1 .main {
        width: 100%;
        flex-direction: column-reverse;
    }
    .pd1 .main .img-box {
        width: 100%;
    }
    .pd1 .main .lf {
        padding-left: 0;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-end;
        padding: 1rem .75rem;
    }
    .pd1 .main .lf .text .item {
        height: auto;
    }
    .pd2 .main .list {
        flex-direction: column;
        padding: 0 .75rem;
    }
    .pd2 .main .list .item {
        width: 100%;
        height: 11rem;
    }
    .pd3 {
        padding: 0 .75rem;
    }
    .pd3 .main {
        width: 100%;
        height: 7.875rem;
    }
    .pd3 .main img:nth-child(2) {
        width: 93%;
        height: 7rem;
        top: .4rem;
    }
    .pd4 {
        padding: 0 .75rem;
    }
    .pd4 .main {
        flex-direction: column;
    }
    .pd4 .main .lf {
        width: 100%;
    }
    .pd4 .main .rg {
        display: none;
    }
    .pd4 .main .swiper-box {
        display: block !important;
    }
    .pd5 {
        margin-top: 3.25rem;
    }
    .pd5 .main {
        padding: 0 .75rem;
    }
    .pd5 .main .swiper-container .swiper-wrapper .swiper-slide .img-box {
        width: 100%;
        height: 8.5rem;
    }
    .pd5 .main .swiper-container .btn svg{
        top: calc(50% - .875rem) !important;
        transform: translateY(-50%) !important;
    }
    .pd5 .main .swiper-container .btn svg.prev {
        left: .75rem;
    }
    .pd5 .main .swiper-container .btn svg.next {
        right: 1.4rem;
    }
    .pd6 .main {
        width: 100%;
        padding: 0 .75rem;
    }
    .pd6 .main .my-table {
        width: 100%;
    }
    .pd6 .main .my-table table tr {
        justify-content: space-between;
    }
    .pd6 .main .my-table table tr td {
        width: 30% !important;
        height: auto;
        font-size: .4rem;
    }
    .pd6 .main .my-table table tr:nth-child(1) td span {
        font-size: .4rem;
    }
    .ab2 {
        margin-top: 3.25rem;
        padding: 0 .75rem;
    }
    .ab2>.text {
        flex-direction: column;
    }
    .ab2>.text .rg {
        margin-top: 1rem;
    }
    .ab2>.text .rg>.text {
        width: 100%;
    }
    .ab2 .main {
        width: 100%;
        height: auto;
        margin-top: 1rem;
    }
    .ab2 .main ul {
        display: none;
    }
    .ab2 .main .swiper-box {
        display: block;
        margin-top: .75rem;
    }
    .ab3 {
        padding: 0 .75rem;
        gap: 1.5rem;
        flex-direction: column;
    }
    .ab3 .lf .img-box {
        width: 100%;
        height: 7rem;
    }
    .ab3 .rg .img-box {
        width: 100%;
        margin-top: 1rem;
    }
    .ab4 {
        margin-top: 2.75rem;
    }
    .ab4 .main .mask {
        display: none;
    }
    .ab4 ul {
        overflow-x: auto;
        justify-content: inherit;
        padding: 0 .75rem;
    }
    .ab4 .main .btn svg.prev {
        left: .75rem;
    }
    .ab4 .main .btn svg.next {
        right: .75rem;
    }
    .ab5 {
        height: 19.2rem;
        margin-top: 2rem;
    }
    .ab5 .top {
        padding: 0 .75rem;
    }
    .ab5 .title p {
        width: auto;
    }
    .ab5 .img-box img {
        transform: translateY(3.5rem);
    }
    .ab5 .more {
        height: auto;
        width: auto;
        padding: .12rem .48rem;
        font-size: .55rem;
    }
    .ab5 .text {
        gap: 0;
        width: 100%;
        justify-content: space-between;
    }
    .ab5 .text .item span {
        font-size: .45rem;
    }
    .popup-mask .popup-content {
        padding-top: 3.25rem;
        width: auto;
    }
    .popup-mask .popup-content .main {
        width: 12rem;
        padding: 1.4rem 0;
    }
    .popup-content .main ul {
        justify-content: center;
    }
    .form1 .main {
        padding: 3.25rem .75rem;
        flex-direction: column-reverse;
    }
    .form1 .main .lf form ul {
        flex-direction: column;
    }
    .form1 .main .lf form ul li,
    .form1 .main .lf form ul li input,
    .form1 .main .lf form ul li textarea{
        width: 100%;
    }
    .form1 .main .lf form ul li input {
        height: 1.5rem;
        font-size: 16px;
    }
    .form1 .main .lf form ul .capt-box img {
        width: 4.35rem;
        height: 1.5rem;
    }
    .form1 .main .lf form ul .capt-box .btn {
        gap: .2rem;
    }
    .form1 .main .lf form ul .capt-box .btn svg {
        width: .6rem;
        height: .6rem;
    }
    .form1 .main .lf form .submit {
        height: 1.5rem;
    }
    .footer {
        padding: 1.375rem .75rem;
    }
    .footer .logo img:nth-child(1),
    .footer .logo span:nth-child(2){
        display: none;
    }
    .footer .logo img:nth-child(3) {
        display: block;
        width: 3.975rem;
        height: 1.5rem;
    }
    .footer .line {
        margin: 1rem 0;
    }
    .footer .ft1 {
        flex-direction: column;
        margin-top: 0;
    }
    .footer .ft1 .list {
        display: none;
    }
    .footer .ft1 .mb-list {
        display: flex;
        flex-direction: column;
    }
    .footer .ft1 .mb-list .items .title {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .footer .ft1 .mb-list .items .title .img-box {
        width: .6rem;
        height: .6rem;
        transition: transform .5s;
        display: flex;
        align-items: center;
        transform-origin: 50% 50%;
    }
    .footer .ft1 .mb-list .items .title .img-box.on {
        transform: rotate(45deg);
    }
    .footer .ft1 .mb-list .items ul {
        display: none;
        flex-direction: column;
        gap: .4rem;
        margin-top: 1rem;
    }
    .footer .ft1 .mb-list .items ul li a {
        color: #fff;
        opacity: .6;
    }
    .footer .ft1 .tel {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
    .footer .ft1 .tel .text {
        text-align: left;
        display: flex;
        flex-direction: column;
        gap: .5rem;
    }
    .footer .ft1 .tel span {
        font-size:0.9rem;
        font-weight: 700;
    }
    .footer .ft1 .tel .list3 {
        display: flex;
        gap: 1rem;
    }
    .footer .ft1 .tel .list3 .items img {
        width: 100%;
        height: 100%;
    }
    .footer .ft1 .tel .list3 .items:nth-child(1) {
        width: 1.2rem;
        height: 1rem;
    }
    .footer .ft1 .tel .list3 .items:nth-child(2) {
        width: 2rem;
        height: .9rem;
    }
    .footer .ft2 .list2 {
        flex-direction: column;
        gap: 1rem;
    }
    .footer .ft2 .list2 .items>span {
        width: 8.55rem;
    }
    .footer .ft2 .list3 {
        display: none;
    }
    .footer .tips {
        flex-direction: column;
    }
    .footer .tips .lf {
        font-size: .55rem;
    }
    .footer .tips span {
        width: 12.225rem;
        font-size: .55rem;
    }
    
}