@font-face{font-family:'HanSFont';src:url('SourceHanSansSC-Regular.otf') format('opentype')}
.fl{float:left}
.hide{display:none;}
.font16 {font-size:1.6rem;}
.font14 {font-size:1.4rem;}
.font12 {font-size: 1.2rem;}
.font10 {font-size: 1rem;}
.font9 { font-size: 0.9rem;}
div ,p{
    outline: none;
}

input {
    outline: none;
}

select {
    outline: none;
}

li {
    outline: none;
}

a {
    outline: none;
}

tr {
    outline: none;
}

textarea {
    outline: none;
}

span {
    outline: none;
}

strong {
    outline: none;
}

img {
    outline: none;
}

h3 {
    outline: none;
}
html{font-size:14px;overflow-x:hidden;}
html{min-height:100%}
body{width:100%;background-color:#fff;font-family:'HanSFont',sans-serif}
.maincontainer{margin:0 auto;display:block;clear:both}
.maincontainer header{height:128px;padding:16px 0px}
.maincontainer header picture{display:block;float:left}
.maincontainer header nav{font-family:'HanSFont',sans-serif;display:block;float:left;position:relative}
.navbar-collapse{margin-left:60px}
.navbar-toggler:focus{box-shadow:none}
.navbar-collapse li{margin-left:10rem}
.navbar-collapse .nav-link{font-family:'HanSFont',sans-serif;font-size:1.1rem;color:black;font-weight:bold;}
@media (min-width:1400px){.navbar-collapse li{margin-left:80px}
}@media (max-width:1399px){.navbar-collapse li{margin-left:4rem}
}@media (max-width:1200px){.navbar-collapse li{margin-left:30px}
}.nav-button{border:0.1rem solid #000}
.nav-button:hover{border:0.1rem solid #000}
.wz{position:absolute;right:0}
.wz .btn{border:0px;background-color:#F5F6F7;width:150px;height:40px;font-size:1rem;line-height:30px;}
.bd-sidebar{display:none}
@media (max-width:992px){.wz{display:none}
.bd-sidebar{display:block}
}.asidebg{background-color:#F5F6F7;padding-top:2rem}
.aside_noactive{background-color:#fff}
.offcanvas-body .nav-link{font-family:'HanSFont',sans-serif;font-size:1.1rem;color:black;padding-left:1rem;width:100%;line-height:10vh;vertical-align:middle;background-color:#fff}
.offcanvas-body .active,.offcanvas-body .nav-link:hover{background-color:#F5F6F7}
.offcanvas-body{height:100%;padding:0;background-color:#fff}
footer{background-color:#111827;width:100%}
.footer-header{border-bottom:1px solid #1F2937;width:100%}
.banquan{color:#6B7280;width:100%;text-align:center;line-height:150px;vertical-align:middle;font-size:1.1rem;display: flex;
  justify-content: center;}
.banquan div{margin-right:20px;float:left;}
.banquan a{color:#6B7280;text-decoration:none;}
:root{--grid-min-size:200px;--grid-gap:20px}
.footer-body{width:100%;margin:0 auto;padding-top:79px;display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--grid-min-size),1fr));gap:var(--grid-gap);grid-template-rows:100px 130px;grid-auto-rows:minmax(100px,auto)}
@media (min-width:992px){.footer-body{grid-template-columns:repeat(3,minmax(var(--grid-min-size),1fr))}
}
/*@media (max-width:992px){.footer-body{grid-template-columns:repeat(2,minmax(var(--grid-min-size),1fr));gap:130px;grid-template-rows:100px 200px;padding:79px 0}
.b3{margin-left:27px}
}
@media (max-width:540px){.footer-body{padding:0;padding-top:79px;grid-template-columns:repeat(1,minmax(var(--grid-min-size),1fr));gap:120px}
.b2{margin-left:30px}
.b3{margin-top:-132px}
.b4{margin-top:-132px}
}*/


@media (max-width:992px) {
    .footer-body {
        grid-template-columns: repeat(2,minmax(var(--grid-min-size),1fr));
        gap: 130px;
        grid-template-rows: 100px 200px;
        padding: 79px 0
    }

    .b4 {
        margin-left: 27px
    }
}

@media (max-width:540px) {
    .footer-body {
        padding: 0;
        padding-top: 79px;
        grid-template-columns: repeat(1,minmax(var(--grid-min-size),1fr));
        gap: 120px
    }

    .b2 {
        margin-left: 30px
    }

    .b3 {
        margin-top: 0px
    }

    .b4 {
        margin-top: -100px
    }
}


    .b1 li, .b2 a {
        margin-bottom: 1rem;
        font-size: 0.9rem;
        color: #9EA5B0;
        width: 100%;
        justify-content: left
    }

    .b2 a {
        text-decoration: none
    }

    .b1:first-child, .b2:first-child {
        color: #FAFAFA;
        font-size: 1.2rem
    }

    .b1:first-child {
        font-weight: bold
    }

    .b1 img {
        width: 118px;
        margin-left: -0.6rem
    }

    .b2 i {
        height: 0px;
        width: 0px;
        display: block;
        margin-left: -11px;
        margin-right: 15px;
        margin-top: -3px
    }

        .b2 i::before {
            color: #fff
        }

    .b2 .m {
        width: 120%
    }

        .b2 .m span {
            display: block;
            width: 80%;
            white-space: normal;
            margin-left: -10px
        }

    .qqico {
        width: 40px;
        display: block;
        margin-right: 1px;
        margin-left: -15px;
        margin-top: -4px
    }

    @media (max-width:758px) {
        .banquan {
            line-height: 90px
        }
    }

    main {
        width: 100%;
        min-height: 20rem
    }



.indexbanner {
position:relative;
}

.swiper-slide {
    position: relative;
    background: url("/image/08.png") no-repeat center;
    background-size: 100% 100%;
    height: 994px;
}



.indexbanner-text {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%)
}

        .indexbanner-text .title {
            font-size: 2.3rem;
            color: #FAFAFA;
            font-weight: bold;
            margin-top: 15%
        }

        .indexbanner-text .title-f {
            font-size: 1.8rem;
            color: rgba(253,253,253,0.9)
        }

        .indexbanner-text .mm {
            width: 1.5rem;
            border: 1px solid #D9D9D9;
            margin-top: 1rem
        }

        .indexbanner-text .ct {
            color: #fff;
            font-size: 1rem;
            margin-top: 1rem;
            white-space: normal;
            width: 30rem;
            line-height: 2rem
        }

    @media (min-width:992px) {
        .indexbanner-text .title {
            margin-top: 20%
        }

        .indexbanner-text .title-f {
            margin-top: 1.5rem
        }

        .indexbanner-text .mm {
            margin-top: 0.5rem;
            width: 1.1rem;
            margin-top: 3rem
        }

        .indexbanner-text .ct {
            color: #fff;
            font-size: 1.3rem;
            margin-top: 3rem;
            white-space: normal;
            width: 40rem;
            line-height: 3rem
        }
    }
@media(max-width:1280px) {

    .swiper-slide {
        height:714px;
    }
}

@media(max-width:1024px) {

    .swiper-slide {
        height: 600px;
    }
}

@media(max-width:768px) {

    .swiper-slide {
        height: 400px;
        background-size:cover;
    }
}
@media (max-width:800px) {
    .banquan {
        display:block;
    }
    .banquan div {
        margin-right:0px;
        width:100%;
        height:40px;
    }
}



    @media (max-width:520px) {


        .swiper-slide {
            height: 300px;
            background-size: cover;
        }

        .indexbanner-text .title {
            margin-top: 10%;
            font-size: 1.2rem
        }

        .indexbanner-text .title-f {
            font-size: 1rem
        }

        .indexbanner-text .mm {
            margin-top: 0.5rem;
            width: 0.8rem
        }

        .indexbanner-text .ct {
            color: #fff;
            font-size: 0.9rem;
            margin-top: 0.5rem;
            white-space: normal;
            width: 20rem;
            line-height: 2rem
        }
    }

    .lable1 {
        width: 100%;
        margin: 0 auto;
        min-height: 20rem;
        clear: both;
        padding-top: 5rem
    }

        .lable1 .title {
            color: #111827;
            margin: 0 auto;
            font-size: 1.2rem;
            text-align: center;
            font-weight: bold
        }

        .lable1 .ct {
            color: #525560;
            font-size: 1.1rem;
            width: 80%;
            white-space: normal;
            text-align: center;
            line-height: 2rem;
            margin: 0 auto;
            margin-top: 1rem
        }

        .lable1 .jb {
            margin: 0 auto;
            margin-top: 1rem;
            width: 2.5rem;
            height: 0.1rem;
            background: linear-gradient( 89deg,#74EF9D 0%,#A6A7FC 100%)
        }

    .lable2 {
        width: 100%;
        margin: 0 auto;
        clear: both;
        display: grid;
        grid-template-columns: repeat(auto-fit,minmax(var(--grid-min-size),1fr));
        gap: var(--grid-gap);
        grid-template-rows: 100px 130px;
        grid-auto-rows: minmax(100px,auto);
        margin-top: -76px
    }

        .lable2 .item img {
            width: 24px;
            height: 24px;
            display: block;
            justify-self: center
        }

        .lable2 .item .title {
            justify-self: center;
            font-size: 1rem;
            color: #111827;
            margin-top: 0.5rem
        }

        .lable2 .item .ct {
            justify-self: center;
            font-size: 1rem;
            margin-top: 0.5rem;
            color: #5A5A5A
        }

    @media (min-width:992px) {
        .lable2 {
            grid-template-columns: repeat(4,minmax(var(--grid-min-size),1fr))
        }
    }

    @media (max-width:992px) {
        .lable2 {
            grid-template-columns: repeat(2,minmax(var(--grid-min-size),1fr));
            gap: 60px;
            grid-template-rows: 100px 200px
        }
    }

    @media (max-width:540px) {
        .lable2 {
            margin-top: 0.5rem;
            grid-template-columns: repeat(1,minmax(var(--grid-min-size),1fr));
            gap: 60px
        }

        .lb22 {
            margin-top: -132px
        }

        .lb23 {
            margin-top: -132px
        }
    }

    .bk {
        background: radial-gradient(circle at center,#242528 0%,#0E0F0F 100%)
    }

    .ai {
        width: 100%
    }

    .zgrid {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2,1fr)
    }

        .zgrid .txt .title {
            font-size: 1.5rem;
            font-weight: bold;
            color: #fff;
            margin-top: 28%
        }

        .zgrid .txt .bd {
            width: 2rem;
            height: 0.1rem;
            background: #fff;
            margin-top: 1rem
        }

        .zgrid .txt li {
            font-size: 1.2rem;
            line-height: 2rem;
            color: #fff;
            margin-top: 1rem;
            width: 80%
        }

        .zgrid .txt ul:first-child {
            margin-top: 1.5rem
        }

        .zgrid .txt1 .title {
            margin-top: 10%;
            margin-left: 3rem
        }

        .zgrid .txt1 .bd {
            margin-left: 3rem
        }

        .zgrid .txt1 ul {
            margin-left: 3rem
        }

    .dt {
        width: 100%;
        background: #fff;
        clear: both;
        padding-top: 1rem
    }

        .dt .ct .bd {
            width: 2rem;
            height: 0.1rem;
            background: #EAB308;
            margin-bottom: 1rem
        }

        .dt .ct .title {
            height: 2rem;
            line-height: 2rem;
            font-size: 1.5rem;
            font-weight: bold;
            margin-bottom: 1rem
        }

        .dt .ct .item picture, .dt .ct .item img {
            width: 100%
        }

        .dt .ct .item {
            position: relative
        }

        .dt .ct .ctxt1, .dt .ct .ctxt2 {
            background-color: #F6F6F6;
            border-radius: 0 1rem 1rem 0
        }

        .dt .ct .ctxt2 {
            border-radius: 1rem 0 0 1rem
        }

    .ctmleft {
        margin-left: 4rem
    }

    .dt .ct .ctitle {
        font-size: 1.2rem;
        width: 100%;
        font-weight: bold;
        margin-top: 20%
    }

    .dt .ct .ctbd {
        width: 1.2rem;
        height: 0.1rem;
        background-color: #1D2130;
        margin-top: 1rem
    }

    .dt .ct .zgrid li {
        font-size: 1rem;
        line-height: 2rem;
        color: #5A5A5A;
        white-space: normal;
        width: 90%;
        margin-top: 1rem;
        margin-left: 1.2rem
    }

    .dt .ct .zgrid {
        margin-top: 0.5rem
    }

    .dt .ct .list {
        padding: 0
    }

        .dt .ct .list:first-child {
            margin-top: 1rem
        }

    .cpinfo img, .cpinfo picture {
        width: 100%;
        display: block;
        margin-top: 1rem
    }

    .pdimg {
        position: relative
    }

        .pdimg img {
            width: 100%
        }

    .pdimg-text {
        width: 80%;
        padding-top: 10%;
        margin-left: 5%
    }

    .pdtitle {
        float: left;
        font-size: 1.5rem;
        color: #fff;
        font-weight: bold
    }

    .pdbd {
        width: 2rem;
        margin: 1rem;
        height: 0.15rem;
        background: #fff;
        margin-top: 1.2rem
    }

    .pdtsmtop {
        margin-top: 3rem
    }

    .products {
        width: 100%;
        clear: both
    }

    .pdstitle {
        width: 100%;
        text-align: center;
        font-size: 1.5rem;
        font-weight: bold;
        color: #111827
    }

    .productsct {
        min-height: 20rem;
        margin-bottom: 3rem
    }

    .productsbtn {
        text-align: center;
        text-decoration: none;
        margin-bottom: 3rem;
        border-radius: 0.2rem;
        background: #fff;
        margin: 0 auto;
        display: block;
        width: 7rem;
        height: 2rem;
        font-size: 1rem;
        line-height: 1.8rem;
        color: #161616;
        border: 0.1rem solid #161616;
        clear: both
    }

    .productsct img {
        width: 100%;
        display: block;
        border-radius: 10px
    }

    .pdsctitle {
        font-size: 1rem;
        font-weight: bold;
        color: #111827;
        white-space: normal;
        width: 100%;
        text-decoration: none;
        display: -webkit-box;
        display: -moz-box;
        overflow: hidden;
        -webkit-line-clamp: 2;
        -moz-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        box-orient: vertical;
        text-overflow: ellipsis;
        max-height: calc(2 * 1.4em);
        word-break: break-word
    }

    .pdscontent, .pdsctime {
        font-size: 0.9rem;
        color: #5A5A5A;
        white-space: normal;
        width: 100%;
        margin-top: 1rem;
        display: -webkit-box;
        display: -moz-box;
        overflow: hidden;
        -webkit-line-clamp: 3;
        -moz-line-clamp: 3;
        line-clamp: 3;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        box-orient: vertical;
        text-overflow: ellipsis;
        max-height: calc(3 * 1.4em);
        word-break: break-word
    }

    .pdsctlink {
        display: block;
        text-decoration: none;
        margin-top: 1rem;
        font-size: 0.9rem
    }

    .Travel {
        margin-top: 3rem;
        clear: both;
        position: relative;
        min-height: 10rem
    }

        .Travel img {
            width: 100%
        }

    .Traveltitle {
        width: 60%;
        font-size: 1.5rem;
        color: #111827;
        text-align: center;
        margin: 0 auto;
        font-weight: bold;
        margin-top: 8%
    }

    .Traveltitle-f {
        width: 100%;
        font-size: 1rem;
        color: #111827;
        text-align: center;
        margin-top: 1rem;
        white-space: normal
    }

    .Traveltitlelist {
        width: 20rem;
        height: 3rem;
        margin: 0 auto;
        margin-top: 1rem
    }

    .Traveltitlebtn {
        border: 0.1rem solid #161616;
        border-radius: 10px;
        display: block;
        text-decoration: none;
        line-height: 3rem;
        vertical-align: middle;
        text-align: center
    }

    .Traveltitlebtndn {
        background-color: #161616;
        font-size: 1.2rem;
        color: #EAB308
    }

    .Traveltitlebtnlink {
        background-color: #EAB308;
        font-size: 1.2rem;
        color: #161616
    }

    @media (min-width:993px) {
        .pdsctitle {
            font-size: 1.3rem;
            font-weight: bold;
            color: #111827;
            white-space: normal;
            width: 100%;
            text-decoration: none;
            display: -webkit-box;
            display: -moz-box;
            overflow: hidden;
            -webkit-line-clamp: 3;
            -moz-line-clamp: 3;
            line-clamp: 3;
            -webkit-box-orient: vertical;
            -moz-box-orient: vertical;
            box-orient: vertical;
            text-overflow: ellipsis;
            max-height: calc(3 * 1.4em);
            word-break: break-word
        }

        .pdscontent, .pdsctime {
            font-size: 1.1rem;
            color: #5A5A5A;
            white-space: normal;
            width: 100%;
            margin-top: 1rem;
            display: -webkit-box;
            display: -moz-box;
            overflow: hidden;
            -webkit-line-clamp: 4;
            -moz-line-clamp: 4;
            line-clamp: 4;
            -webkit-box-orient: vertical;
            -moz-box-orient: vertical;
            box-orient: vertical;
            text-overflow: ellipsis;
            max-height: calc(4 * 1.4em);
            word-break: break-word
        }

        .pdsctlink {
            margin-top: 1rem;
            font-size: 1.2rem
        }
    }

    @media (max-width:992px) {
        .zgrid .txt .title {
            margin-top: 20%
        }

        .zgrid .txt .bd {
            width: 1rem
        }

        .zgrid .txt li {
            font-size: 1rem;
            line-height: 1.5rem;
            color: #fff;
            margin-top: 0.8rem
        }

        .zgrid .txt ul:first-child {
            margin-top: 1rem
        }

        .dt .ct .zgrid li {
            font-size: 1rem;
            line-height: 1.8rem;
            color: #5A5A5A;
            white-space: normal;
            width: 90%;
            margin-top: 1rem
        }
    }

    @media (min-width:769px) {
        .im, .im2 {
            order: 2
        }

        .txt1, .ctxt2 {
            order: 1
        }
    }

    @media (max-width:887px) {
        .Traveltitle {
            margin-top: 3rem
        }
    }

    @media (max-width:768px) {
        .zgrid {
            grid-template-columns: repeat(1,1fr)
        }

            .zgrid .txt .title {
                margin-left: 1.5rem;
                margin-top: 0.1rem
            }

            .zgrid .txt .bd {
                margin-left: 1.5rem;
                width: 0.9rem;
                height: 0.1rem
            }

            .zgrid .txt li {
                font-size: 0.9rem;
                line-height: 1rem;
                color: #fff;
                margin-top: 0.8rem
            }

            .zgrid .txt ul:first-child {
                margin-top: 1rem
            }

        .im, .im2 {
            order: 1
        }

        .txt1, .ctxt2 {
            order: 2
        }

        .zgrid .txt1 .title {
            margin-top: 10%;
            margin-left: 1.5rem
        }

        .zgrid .txt1 .bd {
            margin-left: 1.5rem
        }

        .zgrid .txt1 ul {
            margin-left: 0rem
        }

        .ctmleft {
            margin-left: 1.5rem
        }

        .dt .ct .ctitle {
            margin-top: 2rem
        }

        .dt .ct .ctxt1, .dt .ct .ctxt2 {
            border-radius: 0 0 1rem 1rem
        }

        .dt .ct .zgrid li {
            margin-top: 0.5rem
        }

        .pdbd {
            display: none
        }

        .pdtitle {
            text-align: center;
            width: 100%;
            font-size: 1.2rem
        }

        .pdimg-text {
            width: 100%;
            padding-top: 10%;
            padding-left: 0
        }

        .pdsctitle {
            margin-top: 2rem
        }

        .pdsctlink {
            display: none
        }

        .Traveltitle {
            width: 100%;
            margin-top: 10rem;
            font-size: 1.2rem
        }

        .Traveltitle-f {
            font-size: 0.9rem;
            margin-top: 1rem
        }

        .Traveltitlebtn {
            line-height: 1.8rem;
            height: 2rem
        }

        .Traveltitlebtndn {
            font-size: 1rem
        }

        .Traveltitlebtnlink {
            font-size: 1rem
        }
    }

    @media (max-width:675px) {
        .Traveltitle {
            margin-top: 6rem
        }
    }

    @media (max-width:414px) {
        .Traveltitle {
            margin-top: 2rem
        }
    }