div,p,h3,h4,ul,li{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.floatLeft {float: left;}
.floatRight {float: right;}
.oneRow {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.list-col-detail{
    max-height: 46px;
    overflow: hidden;
}
.twoRow{
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}
.max-con{
    color: rgb(51, 51, 51);
    font-size: 1rem;
    line-height: 1.875;
    text-indent:30px;
    letter-spacing:1px;
    text-align: justify;
    max-height: 100%;
    /*font-family: "PingFang";*/
}
.max-con h3{font-size: 16px; margin: 10px 0;}
.max-con .title2{font-size: 1rem; font-weight: bold;  color: black;}
.max-con{overflow-y: auto;overflow-x: hidden;padding-right: 0.5rem;}
.max-con::-webkit-scrollbar{
    width: 0.3rem;
    height: 1px;
    border-radius:0.5rem;
}
.max-con::-webkit-scrollbar-thumb{
    border-radius:0.5rem;
    background: rgb(212, 210, 217);
}
.max-con::-webkit-scrollbar-track{
    border-radius:0.5rem;
    background: #ebe9f0;
}
.header_page_pano{
    display: none;
}
.loading,.loading2,.loading3{position: relative;}
.loading-div,.loading-div2,.loading-div3{
    position: absolute;
    top:0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 66;
    background-size: cover;
    background-position: center;
}
.loading img {
    display: block;
    width: 100%;
}
.swiper-page-circle{
    position: absolute;
    right: 0;
    bottom: 4rem;
    width: 25rem;
    z-index: 20;
    text-align: center;
}
.swiper-page-circle span{
    display: inline-block;
}
.cm_h__bodyPlaceTarget_map{
    cursor: pointer;
}
.banner-logo{
    position: absolute;
    top:9%;
    left: 4%;
    width: 30%;
    max-width:210px;
    z-index: 33;
}
.banner-down{
    position: absolute;
    right:2rem;
    bottom:2rem;
    z-index: 888;
    display: block;
}
.banner-down>p{
    font-size: 1.25rem;
    color: white;
    display: none;
}
.banner-down>.ac{
    display: block;
    -webkit-animation: zoomIn 1s;
    -o-animation: zoomIn 1s;
    animation: zoomIn 1s;
}
.container-banner{
    width: 100%;
}
.container-banner img{
    display: block;
    width: 100%;
    object-fit: cover;
}
.container-banner .page-line-banner{
    position: absolute;
    bottom: 2rem;
    left: 4.5rem;
    z-index: 22;
}
.container-banner .page-line-banner>span{
    position: absolute;
    left: -2.3rem;
    color: #ffffff;
    font-size: 1.25rem;
}
.container-banner .page-top-banner{
    height: 2rem;
    padding-top: 1rem;
}
.container-banner .line{
    position: absolute;
    width: 0;
    height: 2px;
    background-color: #02cdd2;
    -webkit-transition: width 3s;
    -moz-transition: width 3s;
    -ms-transition: width 3s;
    -o-transition: width 3s;
    transition: width 3s;
    left: 0;
    top:1rem;
    z-index: 33;
}
.container-banner .page-top-banner .swiper-pagination-bullet{
    width: 5rem;
    height: 2px;
    background: white;
    margin: 0;
    border-radius:0;
    display: block;
    float: left;
}
.page-top-banner .swiper-pagination-bullet::before{
    display: none;
}
.home-title{
    position: absolute;
    top:0;
    left: 0;
    color: white;
    z-index:22;
}
.home-title h3{
    font-size: 1.875rem;
    width: 1.875rem;
    line-height: 1.2;
    font-weight: bold;
    position: relative;
    letter-spacing: 0;
}

.home-title span {
    font-size: 1rem;
    width: 1rem;
    line-height: 1.875;
    position: absolute;
    writing-mode: vertical-rl;
    font-weight: normal;
    letter-spacing: 1px;
    top: 0.5rem;
    right: -1.5rem;
}
.title-heng{
    color: white;
    display: inline-block;
    text-align: left;
    font-size: 0.875rem;
    line-height: 1.2;
    padding: 4.28rem 4.28rem 0  1.67rem;
    vertical-align: bottom;
}

.title-heng h3{
    font-size:1.875rem;
    font-weight: bold;
}
.container-videos .text{
    font-size: 16px;
    color: rgb(51, 51, 51);
    line-height: 1.875;
    padding: 1.5rem 0 1rem;
}

.nian-all{
    padding: calc(150em / 18) 0;
}
.nian-all>div{
    position: relative;;
}
.nian-left{
    position: absolute;
    background-color:#02cdd2;
    left: 0;
    top:0;
    height: 50%;
    width: 60%;
    max-width: 800px;
    text-align: right;
    padding-right: 5.5rem;
}
.nian-all .nian-right{
    margin-left: 270px;
    padding-top: 180px;
}
.container-nian a{
    position: absolute;
    top:0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0,0,0,0.3);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    z-index: 77;
}
.container-nian .swiper-slide:hover a{
    opacity: 1;
}
.container-nian .swiper-slide,.container-lists .swiper-slide{
   width: auto;
}
.container-te .swiper-slide{
    height: auto;
}
.container-te .cm-journal{
    padding-bottom: 2rem;
}
.hover-pos-text>a{
    display: block;
}
.hover-pos-text{
    position: relative;
}
.hover-pos-text p{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.3);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    text-align: center;
    color: white;
    opacity: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.hover-pos-text:hover p{
    opacity: 1;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}
.p-top__PublicityVideo{
    padding-top:  calc(60em / 16);
}
.nav-left{
    position: fixed;
    left: 0;
    top:0;
    bottom: 1rem;
    width:250px;
    -webkit-animation: top 0.5s;
    -o-animation: top 0.5s;
    animation: top 0.5s;
    z-index: 55;
}
.village-l-scroll .nav-left.nav-left-active{
    position: fixed;
    padding-top: 1rem;
    background-color: white;
    top: 0;
    /*-webkit-transform: translateY(-50%);*/
    /*-moz-transform: translateY(-50%);*/
    /*-ms-transform: translateY(-50%);*/
    /*-o-transform: translateY(-50%);*/
    /*transform: translateY(-50%);*/
}
.village-l-scroll .nav-left.nav-left-active-bottom{
    position: absolute;
    padding-top: 1rem;
    top:inherit;
    bottom: 9.5rem;
    background-color: white;
}
.nav-left-logo{
    position: absolute;
    top:5rem;
    left: 1rem;
    right: 0;
    height: 12rem;
}
.nav-left-logo img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: scale-down;
    object-position: right;
}
.nav-left li{
    margin-bottom: 2.3rem;
    text-align: right;
}
.nav-left li:last-child{
    margin-bottom: 0;
}

.nav-left-ul .max-con{
    text-indent: 0;
}
.nav-left-ul a {
    text-align: right;
    font-size: 1.125rem;
    color: rgb(153, 153, 153);
    line-height: 1.222;
    position: relative;
}
.nav-left-ul .ac a{
    color: black;
}
.nav-left-ul .ac a::after{
    content: '';
    position: absolute;
    top:50%;
    margin-top: -3px;
    left: -10px;
    width: 6px;
    height: 6px;
    border-radius: 6px;
    background-color: black;
}
.section-products{
    background-color: #f0fcfc;
    padding-bottom: 6.875rem;
}
.products-title{
    position: absolute;
    top:0;
    right: 0;
    writing-mode: vertical-lr;
    color: rgb(51, 51, 51);
    line-height: 1.5;
    display: block;
}
.products-title span{
    display:block;
}
.products-title span.js-title__l{
    font-size: 1.875rem;
    font-weight: bold;
}
.products-title.is-white{
    color: white;
}





.l-scroll{
    padding-left: 320px;
    position: relative;
}
.about-l-scroll.l-scroll{
    background: url("../img/about/about-bei.jpg") no-repeat top right;
}
.container-page-about{
    height: 100vh;
    position: relative;
    cursor: pointer;
}
.container-page-about .about-slide{
    width: auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    height: 100%;
    position: relative;
    transition-property: transform;
}
.container-page-about .about-slide::after{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top:50%;
    height: 1px;
    margin-top: 1.5rem;
    background-color: #bbbbbb;
    z-index: 1;
}
.container-page-about .about-slide>div{
    z-index: 22;
}

.slide-title {
    font-size: 12px;
    color: rgb(187, 187, 187);
    line-height: 1.833;
    text-transform: capitalize;
    padding-left: 7.5rem;
    padding-right: 3rem;
}
.slide-title:first-child{
    padding-left: 0;
    padding-right: 2.5rem;
}
.slide-title>div{
    display: inline-block;
    text-align: center;
}
.slide-title h3 {
    font-size:1rem;
    color: rgb(51, 51, 51);
    font-weight: bold;
    line-height: 1.375rem;
}

.container-page-about .unit-content{
    position: relative;
    padding-left: 60rem;
}
.slide-content>div{
    max-height: 650px;
    height: 80%;
}
.unit-content>div{
    background-color: white;
}
.content-bor{
    border:1px solid #bbbbbb;
    padding: 3rem;
}
.unit-content-img{
    position: absolute;
    left: 2.5rem;
    top:0;
    width: 55rem;
    height: 100%;
}
.bgSet{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    object-fit: cover;
}
.unit-content-detail{
    width: 45rem;
    height: 100%;
}
.leader-content-detail{
    height: 100%;
    background-color: white;
}
.unit-content-detail>div,.leader-content-detail>div{
    height: 100%;
}
.leader-content-detail{
    width: 55rem;
}
.about-l-scroll .nav-left{
    display: flex;align-items: center;
    justify-content: flex-end;
    padding-top: 20rem;
}

.about-leader{
    padding-left: 32rem;
}
.about-leader-img{
    position: absolute;
    left: 0;
    top:0;
    width: 30rem;
    height: 100%;
}
.container-care{
    height: 100%;
    width: 70rem;
}
.about-care{
    padding-left: 58rem;
    height: 100%;
    background-color: white;
}
.about-care-img{
    position: absolute;
    left: 0;
    top:0;
    width: 58rem;
    height: 100%;
}
.about-care .swiper-slide{
    width: auto;
}
.about-care .content-bor{
    padding: 2rem;
    height: 100%;
    display: flex;
    align-items: center;
}
.about-care .content-bor>.max-con{
    height: auto;
    max-height: 100%;
}
.about-dynamic{
    display: flex;
    align-items: center;
}
.about-dynamic>div{
    height: 100%;
    width:60rem;
    margin-right: 2rem;
}
.about-dynamic .xiao{
    height: 80%;
    margin-left: 2rem;
}

.about-work{
    width: 60rem;
    background-color: white;
}
.about-container-honor{
    width: 60rem;
    height: 100%;
}
.about-container-honor .swiper-slide>div{
    width: 100%;
    height: 100%;
    background-size: contain;
}
.about-container-honor .bgSet{
    height: 100%;
    object-fit: scale-down;
}
.about-tuo-all{
    position: relative;
}
.about-tuo-lists{
    width: 85rem;
    height: 100%;
    border:1px solid #bbbbbb;
}
.about-tuo-lists>div{
    display: none;
    height: 100%;
}
.about-tuo-lists>.ac{
    display: block;
}

.about-tuo-lists .swiper-container{
    height: 100%;
}
.about-tuo-lists .bgSet{
    width: 60rem;
    height: 100%;
}
.about-tuo-detail{
    position: absolute;
    right: 0;
    top: 0;
    width: 25rem;
    bottom: 0;
    background-color: white;
    display: flex;
    align-items: center;
    border: none;
    padding-bottom: 6rem;
}
.about-tuo-content>img{
    height: 100%;
}
.about-tuo-content .loading-div{
    top:3rem;
    left: 3rem;
    bottom: 3rem;
    right: 3rem;
}
.about-tuo-detail .max-con,.about-tuo-content .max-con{
    height: auto;
    max-height: 100%;
}
.about-tuo-detail .max-con{
    text-indent: 0;
}
.about-tuo-content {
    background-color: #02cdd2;
    padding: 3rem;
    display: flex;
    align-items: center;
}
.about-tuo-content .max-con{
   color: white;
    width: 100%;
}
.about-tuo-tab{
    position: absolute;
    right: 5px;
    bottom: 0;
    z-index: 20;
    border-bottom:1px solid #bbbbbb;
    background-color: white;
    padding-bottom: 1rem;
}

.about-tuo-tab>span {
    display: inline-block;
     font-size: 1rem;
     color: rgb(153, 153, 153);
     line-height: 2.375;
    margin-left: 1.375rem;
}
.about-tuo-tab>span:first-child{
    margin-left: 0;
}
.posRe{
    position: relative;
}
.about-tuo-tab>.ac{
    position: relative;
    color: rgb(51, 51, 51);
    bottom: 0;

}
.about-tuo-tab>.ac::after{
    content: '';
    width: 100%;
    height: 2px;
    background-color: #000000;
    position: absolute;
    bottom: 0;
    left: 0;
}
.page-banner{
    padding-left: 24rem;
}
.page-banner .banner-img{
    width: 100%;
}
.left-logo{
    position: absolute;
    width: 24rem;
    left:0.5rem;
    top:3rem;
    text-align: center;
}
.ver-banner-text{
    position: absolute;
    left: 7rem;
    bottom: 3.75rem;
    writing-mode: vertical-rl;
    text-align: left;
    color: white;
    font-size: 1.5rem;
}
.ver-banner-text h3 {
     font-size: 1.125rem;
     color: rgb(51, 51, 51);
     text-transform: uppercase;
     line-height: 1.222;
    background-color: white;
    padding: 0.2rem;
    margin-left: 0.3rem;
}
.ver-banner-text h3:last-child{
    margin-left: 0;
}
.ver-banner-text p {
    width: 1.5rem;
}
.ver-banner-text span {
    font-size: 1rem;
}




.village-l-scroll{
    padding-left: 0;
}
.village-l-scroll main{
    padding-left: 15rem;
    padding-top: 9rem;
}
.village-l-scroll .nav-left{
    width: auto;
    top:10rem;
    max-height: 90%;
    bottom: inherit;
    position: absolute;
}
.village-l-scroll .nav-left li{
    width: auto;
}
.village-all{
    padding-bottom: 9.5rem;
}
.village-content-lists{
    padding-left: 6.875rem;
    position: relative;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #bbbbbb;
}
.village-content-lists[data-nav=hua]{
    display: block;
}
.village-content-lists[data-nav=hua] .village-text-detail{
    margin-top: 5%;
}
.village-all .swiper-pagination{
    position: absolute;
    bottom: 1rem;
    right: 68%;
    text-align: right;
}
.village-detail-tab{
    bottom: 1rem;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
}
.village-detail-tab span{
    padding:0.5rem 1rem;
    display: inline-block;
    position: relative;
    cursor: pointer;
}
.village-detail-tab span.ac{
    color: black;
}
.village-detail-tab span.ac::after{
    content: '';
    position: absolute;
    left: 50%;
    height: 1px;
    width: 2rem;
    margin-left: -1rem;
    background-color: black;
    bottom: 0;
}
.vertical-title{
    position: absolute;
    left: 0;
    top:10%;
    display: flex;
    align-items: flex-start;
}

.vertical-title p {
    font-size: 1.875rem;
    color: rgb(0, 0, 0);
    font-weight: bold;
    text-transform: uppercase;
    line-height:1.2;
    width: 1.875rem;
}
.vertical-title span {
    width: 1rem;
    font-size: 1rem;
    color: rgb(153, 153, 153);
    line-height: 1;
    white-space: pre;
    writing-mode: vertical-rl;
    margin-left: 0.6rem;
    padding-top: 0.4rem;
}



.village-content-lists .village-text-content{
    position: absolute;
    left: 6.875rem;
    /*width: 30%;*/
    right: 65%;
    height: 100%;
    padding-top: 2rem;
    /*padding-right: 3rem;*/
    padding-bottom: 6.875rem;
}
.village-detail{
    height: 100%;
    display: flex;
    width: 100%;
    align-items: center;
}
.village-detail .max-con>div{
    display: none;
}
.village-detail .max-con>.ac{
    display: block;
}
.village-content-lists .swiper-father{
    width: 65%;
    margin-left: auto;
}
.village-quan-img{
    margin-left:-21.875rem;
}
.village-quan-img img{
    width: 100%;
}
.village-text-detail{
    position: absolute;
    top:0;
    max-height: 35%;
    left: 6.875rem;
    right: 2rem;
}

.travel-all,.anchor-container{
    width: 95%;
    max-width: 1440px;
    margin: 0 auto;
    padding:8.125rem 0 7.5rem;
    font-size:0.75rem;
    color: rgb(187, 187, 187);
    line-height: 1.833;
}
.travel-all>div{
    width: 102%;
}
.travel-all>div>div{
    float: left;
    width: 31.33%;
    margin-right: 2%;
    margin-bottom: 2.5rem;
    text-transform: capitalize;
}
.travel-all h3,.travel-other-content h3{
    font-size: 1rem;
    color: rgb(51, 51, 51);
    line-height: 1.375;
    padding-top: 1rem;
    font-weight: bold;
}
.travel-all .loading{
    overflow: hidden;
}
.travel-all .loading .loading-div{
    -webkit-transition: all 0.8s;
    -moz-transition: all 0.8s;
    -ms-transition: all 0.8s;
    -o-transition: all 0.8s;
    transition: all 0.8s;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.travel-all .loading:hover .loading-div{
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: all 0.8s;
    -moz-transition: all 0.8s;
    -ms-transition: all 0.8s;
    -o-transition: all 0.8s;
    transition: all 0.8s;
}
img.loading-div{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page-banner-village{
    background: url("../img/travel/bei2.jpg") no-repeat bottom left;
}
.detail-top-title{
    left: 16rem;
    top:50%;
}
.detail-top-title span{
    margin-right: 0.6rem;
}
.travel-detail-all{
    width: 75%;
    margin: 0 auto;
}
.anchor-container{
    text-align: right;
    padding: 2.3rem 0;
    font-size: 1rem;
    color: rgb(153, 153, 153);
    line-height: 2;
}
.anchor-container span{
    padding: 0 0.5rem;
}
.anchor-container .current-anchor{
    color: #333333;
}
.marTopBom5{
    margin-top: 5rem;
    margin-bottom: 1rem;
}
.travel-detail-all .detail{
    color: rgb(51, 51, 51);
    font-size: 16px;
    line-height: 2;
    padding: 1rem 0;
}
.travel-detail-all .max-con-content{
}
.container-other .swiper-slide{
    width: auto;
    text-align: center;
}
.travel-other-content{
    width: 87.5%;
    margin-left: auto;
    margin-bottom:7.5rem;
}
.travel-other-content p{
    font-size: 10px;
    color: rgb(187, 187, 187);
    line-height: 2.2;
}
.father-travel-detail .swiper-pagination{
    position: absolute;
    right: 0;
    display: flex;
    align-items: center;
    bottom: 2rem;
    background-color: white;
}
.father-travel-detail .swiper-pagination>span{
    margin: 0 2px;
}
.next-prev-circle{
    position: absolute;
    right: 0;
    bottom: 3rem;
    display: flex;
}
.other-title{
    font-size: 1rem;
    color: rgb(153, 153, 153);
    line-height: 1.375;
    padding:9rem 0 3rem;
}
.other-title h3{
    color: rgb(51, 51, 51);
    font-weight: bold;
    font-size: 1.875rem;

}
.video-js{
    width: 101%;
    height: 101%;
}

.specialty-l-scroll{
    background: url("../img/specialty/bei.jpg") no-repeat 80% top;
}
.specialty-l-scroll main{
    padding-top: 0;
    padding-bottom: 7.5rem;
}
.page-banner-specialty {
    padding-left: 10rem;
    padding-right: 2.5%;
}
.page-banner-specialty .left-logo{
    width: 20rem;
}
.specialty-l-scroll .nav-left{
    top:0;
    left: 4rem;
}
.specialty-l-scroll main{
    min-height: 42rem;
}

.nav-left-specialty_pc{
    display: block;
}
.swiper-nav-specialty{
    display: none;
}
.page-specialty-content{
    width: 75%;
    /*max-width: 1320px;*/
    margin: 0 auto;
}

.specialty-title{
    color: rgb(153, 153, 153);
    line-height: 1.375;
    text-align: center;
    padding: 10rem 0 9rem;
    position: relative;
}
.specialty-title .nav-left-logo{
    right: inherit;
    left: -10rem;
}
.specialty-title h3{
    font-size: 1.875rem;
    color: rgb(0, 0, 0);
    line-height: 1;
    font-weight: bold;
}

.specialty-tab {
    text-align: right;
    color: rgb(153, 153, 153);
    line-height: 1;
    margin-bottom: 4rem;
}
.specialty-tab span{
    margin-left:2.5rem;
    padding-bottom: 0.75rem;
    position: relative;
    cursor: pointer;
}
.specialty-tab span:first-child{
    margin-left:0;
}
.specialty-tab>.ac{
    color: rgb(51, 51, 51);
}
.specialty-tab span.ac::after{
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: #333333;
}

.specialty-content>div{
    display: none;
}
.specialty-content>div.ac{
    display: block;
}
.specialty-content .max-con{
    margin-bottom: 5rem;
    line-height: 1.75;
    color: rgb(102, 102, 102);
    padding-right: 0;
}
.specialty-next-prev{
    display: flex;
    padding-top: 5rem;
}
.specialty-next-prev>.page-btn-specialty{
    display: flex;
}
.specialty-next-prev .swiper-button-disabled{
    display: none;
}
.page-btn-specialty .swiper-pagination-bullet{
    width: 3.75rem;
    height: 3.75rem;
    text-align: center;
    color: rgb(255, 255, 255);
    font-size: 1.375rem;
    line-height: 3.75rem;
    background-color: rgba(2,205,210,0.46);
    margin-left:1.5rem;
    margin-top: 0;
}
.page-btn-specialty .swiper-pagination-bullet.swiper-pagination-bullet-active{
    background-color:rgba(2,205,210,1);
}
.page-btn-specialty .swiper-pagination-bullet:before{
    display: none;
}
.page-videos{
    text-align: right;
    padding: 1rem 0;
    position: absolute;
    right: 0;
    bottom: 0;
}
.page-videos .swiper-pagination-bullet-active svg circle{
    animation: bullet-anim-auto 4s linear infinite;
}
.page-banner-travel{
    background: url("../img/travel/bei2.jpg") no-repeat left bottom;
    background-size: 12rem;
}
.page-banner-travel #travel-banner{
    display: block;
    width: 100%;
    max-width: inherit;
}


@media screen and (max-width: 1630px) {
    .about-l-scroll.l-scroll {
        padding-left: 240px;
    }
    .about-l-scroll .nav-left {
        padding-top: 16rem;
        padding-bottom: 16rem;
        width: 150px;
    }
    .about-l-scroll .nav-left-logo {
        top: 2rem;
        height: 9rem;
    }
    .slide-title {
        padding-left: 3.5rem;
        padding-right: 1rem;
    }
    .slide-title:first-child {
        padding-left: 0;
        padding-right: 0;
    }
    .content-bor,.about-tuo-content{
        padding: 2rem;
    }
    .container-page-about .unit-content {
        padding-left: 43rem;
    }
    .unit-content-img{
        width: 38rem;
    }
    .container-page-about .unit-content-detail{
        width:35rem;
    }
    .about-leader {
        padding-left: 22rem;
    }
    .about-leader-img {
        width: 20rem;
    }
    .leader-content-detail {
        width: 30rem;
    }

    .container-care{
        width: 60rem;
    }
    .about-care {
        padding-left: 40rem;
    }
    .about-care-img {
        width: 40rem;
     }
    .about-tuo-lists .bgSet {
        width: 35rem;
    }
    .about-tuo-lists {
        width: 60rem;
    }
    .about-dynamic>div {
        width: 40rem;
    }
    .about-work,.about-container-honor{
        width: 40rem;
    }
}


@media screen and (max-width: 1350px) {
    .detail-top-title{
        top:22rem;
        text-align: right;
        left: 0;
        width: 21rem;
        display: block;
    }
    .detail-top-title>span,.detail-top-title>p{
        width: 100%;
        writing-mode: initial;
        font-size:0.75rem;
    }
    .detail-top-title>p{
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 1024px) {

    .header_page_pano{
        display: block;
        width: 7.5rem;
        font-size: 1rem;
        text-align: center;
        background-color: rgb(2, 205, 210);
        color: rgb(255, 255, 255);
        border-radius: 1.125rem;
        padding:0.7rem 1.5rem;
        line-height: 1;
        cursor: pointer;
        margin-bottom: 4rem;
    }

    .c-link {
        font-size: calc(10em / 16);
    }
    .page-btn-specialty .swiper-pagination-bullet {
        width: 2.8rem;
        height: 2.8rem;
        line-height: 2.8rem;
        background-color: rgba(2,205,210,0.46);
        margin-left: 0.5rem;
    }


    .nav-left-ul a {
        font-size: 1rem;
    }
    .nav-left li {
        margin-bottom: 1rem;
        text-align: right;
    }
    .banner-logo{
        max-width: 140px;
        top:5%;
        left: 2%;
    }


    .container-banner .page-line-banner{
        bottom: 1rem;
    }
    .container-banner .page-line-banner>span{
        position: absolute;
        left: -2.3rem;
        color: #ffffff;
        font-size: 1.25rem;
    }
    .container-banner .page-top-banner{
        height: 2rem;
    }
    .container-banner .line{
        top:1rem;
    }
    .container-banner .page-top-banner .swiper-pagination-bullet{
        width: 3rem;
    }


    .nian-left{
        padding-right: 2rem;
        height: 65%;
    }
    .nian-left .c-link.is-white{
        width: 100%;
        padding-top: 1.67rem;
        padding-left: 2.3rem;
    }
    .title-heng{
        width: 100%;
        padding-right: 0;
    }
    .title-heng h3{
        font-size:1.5rem;
        font-weight: bold;
    }

    .home-title h3{
        font-size: 1.5rem;
        width: 1.5rem;
    }
    .nian-all {
        padding: calc(100em / 18) 0;
    }
    .nian-all .nian-right {
        margin-left: 150px;
        padding-top: 200px;
    }
    .p-top__journalBody {
        padding-right: 0;
    }

    .products-title {
        position: initial;
        top: auto;
        right: auto;
        writing-mode: initial;
        color: rgb(51, 51, 51);
        line-height: 1.5;
        display: block;
        text-align: center;
        margin-bottom: 5rem;
    }
    .products-title span.js-title__l,.products-title span.js-title__l,.p-top__thinkBodyBlock .title__jp{
        font-size: 1.5rem;
    }
    .p-top__journalBodyMain .otherpost {
        width: 95%;
        position: initial;
        left: initial;
        top: initial;
        height: auto;
        max-width: 500px;
        margin: 0 auto;
    }
    .p-top__journalBodyMain .newpost .c-link{
        left: auto;
        right: 0;
        margin-left: 0;
    }
    .products-title.is-white{
          color: #000;
    }
    .p-top__video{
        padding-top: 0;
    }


    /*.container-nian .swiper-slide,*/
    /*.container-lists .swiper-slide{*/
        /*width: ;*/
    /*}*/

    ..page-specialty-content{
        width: 95%;
    }

    .village-detail-tab {
        bottom: auto;
        position: initial;
        left: auto;
        right: auto;
        margin-bottom: 2rem;
    }
    .village-l-scroll main {
        padding-left: 10rem;
        padding-top: 4rem;
    }
    .village-l-scroll .nav-left{
        top:6rem;
    }
    .village-all .swiper-pagination{
        padding-top: 0.5rem;
        text-align: center;
        position: initial;
        right: initial;
        left: initial;
    }
    .page-banner{
        padding-left: 12rem;
    }
    .detail-top-title{
        display: none;
    }
    .left-logo {
        width: 10rem;
    }



    .village-content-lists {
        display: block;
    }
    .village-content-lists .village-text-content {
        position: initial;
        left: initial;
        width: 100%;
        height: 100%;
        padding-top: 2rem;
        padding-right: 1rem;
        padding-bottom: 2rem;
    }
    .village-content-lists .swiper-father {
        width: 100%;
    }
    .village-detail .max-con{
        max-height: 20rem;
    }

    .nav-left-specialty_pc{
        display: none;
    }
    .swiper-nav-specialty{
        display:block;
        width: 95%;
        margin: 0 auto 2rem;
    }
    .swiper-nav-specialty .swiper-slide{
        width: auto;
    }


    .specialty-l-scroll main{
        padding-top: 0;
        padding-left: 0;
    }
    .specialty-l-scroll .nav-left {
        position: initial;
        left: auto;
        top: auto;
    }
    .specialty-l-scroll .nav-left-ul {
        position: relative;
        width: 100%;
        height: 100%;
        z-index: 1;
        display: flex;
        transition-property: transform;
    }
    .village-l-scroll .nav-left li,.swiper-nav-specialty .swiper-slide{
        width: auto;
        flex-shrink: 0;
        height: 100%;
        position: relative;
        transition-property: transform;
        padding: 1rem 0;
    }
    .swiper-nav-specialty .swiper-slide a{
        font-size: 1.125rem;
        padding-left: 12px;
    }
    .swiper-nav-specialty .ac a::after{
        left: 0;
    }

    .page-banner-specialty .left-logo{
        width: 12rem;
        left: 0.5rem;
    }
    .travel-all .clearFloat{
        display: flex;
        justify-content: space-between;
        flex-wrap:wrap;
    }
    .travel-detail-all{
        width: 95%;
    }
    .travel-other-content{
        width: 95%;
    }
    .clearFloat-3-2>div {
        width: 47.5%;
    }


    .travel-all>div>div {
        width: 48%;
    }

    .travel-all, .anchor-container{
        padding-top: 4rem;
        padding-bottom: 3.5rem;
    }


    .about-l-scroll .nav-left{
        width: 140px;
    }
    .about-l-scroll.l-scroll {
        padding-left: 190px;
    }
    .container-other .swiper-slide{
        width: 350px;
    }
    .cm-f__bodyInfoLink .item>a {
        font-size: 1rem;
        padding: 1rem 0;
    }
    .cm-f__bodyInfo{
        min-width: 60%;
    }
}



@media screen and (max-width: 900px) {
    .page-banner-specialty .left-logo {
        width: 8rem;
    }
    .specialty-title {
        padding: 10rem 0 4rem;
    }
    .specialty-l-scroll{
        background-size: 45%;
    }
    .content-bor, .about-tuo-content {
        padding:1rem;
    }
    .about-l-scroll .nav-left {
        width: 100%;
        left: 0;
        bottom: auto;
        padding: 0 0 0 10rem;
        height: 150px;
        background-color: white;
        -webkit-box-shadow: 0 0.1rem 0.6rem 0 #bbbbbb;
        -moz-box-shadow: 0 0.1rem 0.6rem 0 #bbbbbb;
        box-shadow: 0 0.1rem 0.6rem 0 #bbbbbb;
    }
    .about-l-scroll .nav-left-logo{
        right: auto;
        left: 0.5rem;
        height: 6rem;
    }
    .about-l-scroll .nav-left-ul{
        position: absolute;
        left: 13rem;
        right: 5rem;
    }
    .about-l-scroll .nav-left-ul>li{
        float: left;
    }
    .slide-title{
        text-align: center;
        justify-content: center;
    }
    .slide-title h3 {
        font-size: 1.875rem;
        line-height: 1.875rem;
        margin-bottom: 0.5rem;
    }
    .container-page-about .about-slide::after{
        display: none;
    }
    .slide-content>div{
        height: auto;
        max-height: inherit;
    }
    .container-page-about{
        height: auto;
        overflow-y: auto;
        position: absolute;
        top:170px;
        bottom: 0;
        right: 0;
        left: 0;
    }
    .container-page-about>.swiper-wrapper{
        display: block;
    }
    .about-l-scroll.l-scroll{
        padding-left: 0;
        padding-top: 200px;
        height: 100vh;
    }
    .container-page-about>div>.about-slide{
        width: 100%;
        height: auto;
        padding: 1rem;
    }

    .container-page-about .unit-content {
        padding-left: 0;
    }
    .unit-content-img {
        width: 100%;
        position: initial;
        height: auto;
        margin: 0 auto 1rem;
        left: auto;
        top: auto;
    }
    .container-page-about .unit-content-detail {
        width: 100%;
    }
    .container-page-about .unit-content-detail .max-con{
        max-height: 25rem;
    }

    .about-leader {
        padding-left:0;
    }
    .about-leader-img {
        width: 100%;
        max-width: 300px;
        position: inherit;
        left: auto;
        top: auto;
        margin: 0 auto 2rem;
        display: block;
    }
    .leader-content-detail {
        width: 100%;
    }
    .leader-content-detail .max-con{
        max-height: 25rem;
    }
    .container-care{
        width: 100%;
    }
    .about-care{
        padding-left:0;
        max-width: 560px;
        margin: 0 auto;
    }
    .about-care-img {
        width: 40rem;
        position: inherit;
        left: auto;
        top: auto;
    }
    .about-dynamic {
        flex-flow: column;
    }
    .about-dynamic .xiao{
        height: auto;
        margin-top: 2rem;
        margin-left: 0;
    }

    .about-tuo-tab {
        position: initial;
        left: auto;
        bottom: auto;
        padding-top: 3rem;
    }
    .about-tuo-all{
        width: 100%;
    }
    .about-tuo-lists {
        width: 100%;
    }
    .about-tuo-lists .bgSet{
        width: 100%;
        height: auto;
    }
    .about-tuo-detail {
        position: static;
        right: auto;
        top: auto;
        width: 100%;
        bottom: auto;
        background-color: white;
        display: flex;
        align-items: center;
        border: none;
    }

    .swiper-page-circle{
        width: auto;
        right: 0.5rem;
        bottom: 3rem;
        left: 0.5rem;
    }



    .about-work .max-con{
        max-height: 25rem;
    }
    .about-work, .about-container-honor{
        width: 100%;
    }
    .slide-content .swiper-father{
        width: 100%;
    }

}


@media screen and (max-width: 800px) {
    .nian-all .nian-right{
        margin-left: 5rem;
    }
}

@media screen and (max-width: 768px) {
    .banner-down{
        display: none;
    }
    .p_video_all{
        padding-top: 5rem;
        padding-bottom: 4rem;
    }
    .container-videos-father{
        width: 100%;
        padding-top: 4rem;
    }
    .nian-left{
        padding-right: 0;
    }

    .cm-h__nav-inner-top{
        padding: 1rem;
    }
    .cm-h__logo{
        margin-bottom: 5rem;
    }
    .cm-h__logo a{
        display: block;
        width: 60%;
        max-width:180px;
    }
    .cm-h__navBodyMain .item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 1.5rem;
        border-bottom: 1px solid #f2f2f2;
        padding-bottom: 1.5rem;
    }
    .cm-h__navBodyMain .item a{
        text-align: left;
    }
    .cm-h__nav-inner-top>.address span{
        display: block;
    }
    .container-lists .swiper-slide{
        width: 300px;
    }


    .container-banner .page-line-banner{
        bottom: 0;
        left: 3rem;
    }
    .container-banner .page-line-banner>span{
        position: absolute;
        left: -2.3rem;
        color: #ffffff;
        font-size: 1.25rem;
    }
    .container-banner .page-top-banner .swiper-pagination-bullet{
        width: 3rem;
    }

    .page-banner{
        padding-left: 0;
    }

    .left-logo{
        z-index: 8;
        width: 25%;
        max-width: 10rem;
        left: 1rem;
        top:1rem;
    }
    .ver-banner-text{
        left: auto;
        right: 1rem;
        bottom: 1rem;
    }

    .container-other .swiper-slide{
        width: 260px;
    }
}


@media screen and (max-width: 600px) {
    .nian-all .nian-right{
        margin-left: 2.5rem;
    }
    .about-l-scroll .nav-left-logo{
        height: 5.5rem;
    }
    .about-l-scroll .nav-left-ul>li{
        margin-bottom: 0.5rem;
    }
    .about-l-scroll .nav-left-ul {
        left: 9rem;
    }


    .village-all{
        padding-bottom: 6.5rem;
    }
    .village-l-scroll main{
        padding-left: 7rem;
    }
    .village-l-scroll .nav-left{
        width: 6rem;
    }
    .village-l-scroll .nav-left .max-con{
        text-indent: 0;
    }
    .village-l-scroll .nav-left li{
        padding: 0.5rem 0;
        margin-bottom: 0;
    }
    .village-l-scroll .nav-left.nav-left-active{
        top:3rem;
    }
    .village-l-scroll .nav-left.nav-left-active-bottom{
        bottom: 6.5rem;
        top:inherit;
    }
    .village-content-lists{
        padding:0;
    }

    .vertical-title {
        position: initial;
        left: auto;
        top: auto;
        display: block;
        text-align: center;
        padding-top: 5rem;
    }
    .vertical-title p {
        font-size: 1.875rem;
        line-height: 1.2;
        width: 100%;
    }
    .vertical-title span {
        font-size: 1rem;
        white-space: pre;
        writing-mode: initial;
        margin-left:0;
    }
    .village-text-detail {
        position: initial;
        top: auto;
        left: auto;
        right: auto;
        padding-top: 1rem;
        max-height: 20rem;
        margin: 0 0.5rem 1rem 0;
    }
    .specialty-l-scroll main{
        padding-left: 0;
    }
}

@media screen and (max-width: 400px) {
    .nian-all .nian-right{
        margin-left: 2.5rem;
    }
    .about-l-scroll.l-scroll{
        padding-top: 140px;
    }
    .container-page-about{
        top:120px;
    }
    .about-l-scroll .nav-left{
        padding-left: 0;
        height: 100px;
    }
    .about-l-scroll .nav-left-logo{
        display: none;
    }
    .about-l-scroll .nav-left-ul>li{
        margin-bottom: 0.5rem;
    }
    .about-l-scroll .nav-left-ul {
        left: 0;
        right: 0.5rem;
    }
}