@media screen and (min-width: 1920px) {
    .batch-page-content {
        background-size: cover;
    }
}

@media screen and (min-width: 1280px) {
    .search-modal-content {
        width: 1100px;
    }
}

@media screen and (max-width: 1440px) {
    .content {
        max-width: 1200px;
    }
}
@media screen and (max-width: 1200px) {
    .show-m{
        display: block;
    }
    .show-pc{
        display: none !important;
    }
}
@media screen and (max-width: 1280px) {

    .onshow-swiper-text span {
        margin-top: 10px;
        display: inline-block;
    }
    
    .header .header-logo{
        margin-left: 20px;
    }
    .header .menu>li{
        margin: 0 20px;
    }
    .content {
        width: 89.33%;
        margin: 0 auto;
    }
    .disflex{
        display: block;
    }
    .footer-content  {
        padding-top: 24px;
        /* line-height: 68px; */
        line-height: 30px;
        text-align: center;
        width: 100%;
    }
    .footer-content  .back-to-top{
        margin-right: 20px;
    }
    .links>div {
        text-align: left;
        padding-left: 18px;
    }
    .footer-content .disflex{
        display: block;
    }
    .footer-content .links ul li{
        text-align: left;
    }
    .swiper-pagination-bullets.index-banner-pagination{
        bottom: 1em;
        width: 100%;
    }
    .home-page .index-swiper .swiper-pagination-bullet{
        margin-right: 5px;
        width: 8px;
        height: 8px;
    }
    .home-page .pannel-01 .body{
        height: auto;
    }

    .home-page .pannel-01 .body .right{
        width: 100%;
        height: auto;
    }
    .home-page .pannel-01 .body .right img{
        width: 100%;
    }
    .home-page .pannel-02 .right{
        width: 100%;
        height: auto;
    }
    .home-page .pannel-02 .right .list li:nth-child(1){
        width: 60%;
    }
    .home-page .pannel-02 .right .list li:not(:nth-child(1)){
        width: 30%;
    }
    .home-page .pannel-02{
        padding-bottom: 20px;
        /* background-color: #fff; */
    }
    .home-page .home-content{
        padding: 20px 0;
    }
    .home-page .pannel-03{
        height: auto;
    }
    
    .home-page .pannel-03 .body .left p:nth-child(2){
        margin: 10px 0;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3; 
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .home-page .home-content .tit_66{
        margin-bottom: 20px;
    }
    .home-page .swiper-body .right img{
        height: auto;
    }
    .home-page .pannel-04{
        padding: 20px 0;
    }
    .home-page .pannel-04 .body{
        padding: 10px;
    }
    .home-page .pannel-04 .body .right p{
        margin-top: 0;
    }
    .home-page .pannel-05{
        height: auto;
        padding: 40px 0;
        background-size: cover;
    }
    
    .pannel-05-right-tit{
        font-size: 22px;
    }
    .header .header-body{
        width: 100%;
    }
    .openclass-body-description{
        padding-top: 40px;
    }
    .onshow-swiper-box .swiper-button-next, .onshow-swiper-box .swiper-button-prev{display: none;}
    .swiper-button-next, .swiper-button-prev{
        /* display: none; */
    }
    .onshow-swiper img{
        width: 100%;
        height: auto;
    }
    .onshow-content div{
        /* display: flex; */
        /* padding: 0 10px; */
        margin-bottom: 20px;
        width: 100%;
        box-sizing: border-box;
    }
    .onshow-content div:nth-child(2){
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .onshow-content div select{
        min-width: auto;
        display: block;
        width: 100%;
        margin-bottom: 10px;
    }
    .project-list{
        margin: 0;
        justify-content: space-between;
    }
    .project-list>li{
        width: 100%;
        margin: 0 0 20px 0;
    }
    .page-title{
        margin-bottom: 30px;
    }
    .project-list .pic img{
        height: auto;
    }
    .fifth-page-content .banner-box, .batch-page-content .banner-box{
        height: 50vw;
        background-size: cover;
    }
    

    .fifth-page-content .nav-box{
        /* background-color: #fff; */
        /* padding: 10px; */
    }
    /* .nav-box .nav{
        width: 100%;
        flex-wrap: wrap;
        height: auto;
        gap: 10px;
    } */
    /* .nav-box .nav li{
        background-color: #9adde3;
    } */
    /* .fifth-page-content .category-list{
        width: 100%;
        flex-wrap: wrap;
    } */
    .fifth-page-content .text_01 {
        padding: 20px 10px;
        box-sizing: border-box;
    }
    .page-title p{
        font-size: 2em;
    }
    .completed-title{
        margin-bottom: 20px;
        
    }
    .completed-title .select{
        top: -8px;
        width: 20vw;
        top: 50%;
        transform: translateY(-50%);
    }
    .form-box select, .onshow-content select{
        background-position: right 10px center;
    }
    .unesco-page .content .tit{
        /* margin-bottom: 40px; */
        font-size: 22px;
    }
    .completed-title select{
        width: 20vw;
    }
    .organizers-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        padding: 0 10px;
    }
     .years-home-swiper .swiper-button-next,.years-home-swiper .swiper-button-prev{
        background-color: #fff;
        width: 40px;
        height: 40px;
        border-radius: 50%; 
     }
     .swiper-button-next:after, .swiper-button-prev:after{
        height: 40px;
     }
    .years-home-swiper .swiper-button-next{
        right: 10px;
    }
    .years-home-swiper .swiper-button-prev{
        left: 10px;
    }
    
    .organizers-list li{
        width: 40%;
    }
    .years-organizers-list.organizers-list li{
        width: 50%;
    }
    .detail-page .detail-item .left p span{
        display: inline;
    }
    .detail-page .notes{
        margin-bottom: 20px;
    }
    
    .exhibition-content-title .left p:nth-child(2){
        width: 100%;
    }
    .exhibition-content-title .right{
        width: 100%;
    }
    .exhibition-list li{
        height: auto;
        width: 100%;
        margin-bottom: 20px;
    }
    .exhibition-list li img{
        height: auto;
    }
    .exhibition-list li p{
        padding:10px 20px;
        bottom: 20px;
        height: 35px;
    }
    .exhibition-list li p span{
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        margin-right: 10px;
    }
    .exhibition-list li p a{
        width: 70px;
        flex: 0 0 auto;
    }
    .openclass-content{
        padding: 0 10px;
    }
    .openclass-content .left{
        width: 100%;
        margin-bottom: 40px;
    }

    .detail-page .banner-box{
        height: auto;
    }
    .detail-page .banner-box .banner-cont .left{
        padding-right: 0;
    }

    .detail-page .banner-box .banner-cont .right{
        width: 100%;
    }
    .detail-page .banner-box .banner-cont .right img{
        width: 100%;
    }
    
    #video-list li, #image-list li{
        width: 32%;
        height: auto;
        /* padding: 0 2%; */
        margin-bottom: 4%;
        max-height: 163px;
    }
    .form-box select, .onshow-content select{
        min-width: 20px;
    }
    .unesco-page .content .menu{
        /* position: fixed !important; */
        /* top: 56vw !important; */
        right: 10px !important;
        left: auto!important;
    }
    .form-box form{
        margin-bottom: 20px;
    }
    .unesco-page .breadcrumbs{
        padding: 20px 10px;
        height: auto;
        line-height: 2em;
    }
    .unesco-detail-page .panel-1 .left{
        padding: 20px 20px;
    }
    .unesco-detail-page .panel-1 .right{
        width: 100%;
        height: auto;
    }
    .showJoinTime-list{
        display: block;
    }
    .showJoinTime-list li{
        margin-bottom: 20px;
        padding: 20px;
    }
    .showJoinTime-list li .left{
        margin-right: 10px;
    }
    .showJoinTime-list li .right{
        line-height: 1.6;
    }
    
    .unesco-detail-page .panel-1 .left .left-bottom{
        padding-top: 20px;
    }
    .description-box{
        margin-top: 10px;
        padding-bottom: 20px;
    }
    .description-box .description-text{
        padding: 0 10px;
    }
    .unesco-detail-list{
        gap: 2%;
        justify-content: space-between;
    }
    .unesco-page .convention-swiper{
        width: 100%;
        height: 72vw;
    }
    .unesco-page .convention-swiper .swiper-slide{
        height: 32vw !important;
    }
    .unesco-page .convention-swiper .swiper-slide img{
        /* height: 46vw !important; */
        /* height: 100%; */
    }
    .unesco-detail-list li{
        width: 32%;
        padding-bottom: 20px;
    }
    .unesco-detail-list li img{
        width: 100%;
        height: auto;
    }
    .unesco-detail-list li .title{
        padding-top: 1em;
    }
    .unesco-sub-tit span{
        font-size: 20px;
    }
    .vedeo-page .breadcrumbs{
        padding: 20px 10px;
    }
    .home-page .pannel-03{
        background-size: cover;
        padding-bottom: 20px;
    }
    .home-page .pannel-03 .swiper-button-prev, .home-page.pannel-03.swiper-button-next{
       display: none;
    }
    .home-page .pannel-03 .body .left p:nth-child(2){
        width: 100%;
    }
    .openclass-page .banner-text>div,
    .exhibition-page .banner-text>div,
    .onshow-page .banner-text>div{
        padding: 20px;
    }
    .home-page .swiper-btn-box{
        display: flex;
    }
    .content,
    .title-box {
        width: 89.33%;
        margin: 0 auto;
        max-width: 992px;
    }
    .title-box .disflex img{
        margin-bottom: 20px;
    }
    .title-box .tit_07{
        display: block;
        line-height: 4;
    }
    .steps-box{
        margin-left: 20px;
    }
    .steps-box .steps-item{
        display: block;
    }
    .steps-box .steps-item .steps-item-left .year{
        position: static;
    }
    .steps-box .steps-item .steps-item-left{
        width: auto;
        padding: 0 20px 20px 0;
        margin-left: 20px;
    }
    .steps-box .steps-item .steps-item-right{
        margin-left: 20px;
        padding-right: 20px;
    }
    .intro-detail-item{
        width: 100%;
    }
    .intro-detail-item .left{
        width: 100%;
    }
    .intro-detail-item .right{
        padding: 20px 0;
    }
    .intro-detail-item .right p:first-child{
        margin-bottom: 20px;
    }
    .text-01 {
        padding: 20px;
    }
    .intro-list{
        width: 100%;
        overflow: auto;
        display: flex !important;
        flex-wrap: nowrap;
    }
    .intro-list li{
        flex: 0 0 auto;
    }
    .vision-content{
        padding: 20px;
    }
    .steps-box .steps-item .steps-item-left .show-pc{
        display: none;
    }
    .steps-box .steps-item .steps-item-right .show-m{
        display: block;
        color: #888;
        margin-top: 20px;
    }
    .steps-box .steps-item .steps-item-right img{
        width: 100%;
    }

    /* .sub-title .text{
        line-height: 1.8;
    } */
    .project-list{
        gap: 2%;
    }
    .project-list>li{
        width: 32%;
        margin: 0 0 20px;
    }
    .nav-box{
        width: 100%;
        overflow: auto;
    }
    .fifth-page-content .nav-box{
        padding: 0;
    }
    .nav-box .nav{
        width: auto;
        display: flex;
        transition: transform 0.3s ease; 
    }
    .nav-box .nav li{
        flex: 0 0 auto;
       
    }
    .nav-box .nav li a{
        padding: 0 30px;
    }
    .nav-box .nav a{
        text-align: center;
        padding: 0;
    }
    .completed-content .project-list>li{
        margin-bottom: 10px;
    }
    .completed-content .project-list .title{
        padding-left: 0;
    }
    /* .organizers-list li{
        width: 45vw;
    } */
    .home-page .pannel-01 .bg_01{
        display: none;
    }
    .home-page .pannel-01 .body .left{
        background-color: #fff;
        padding: 20px 10%;
        margin-bottom: 20px;
    }
    .home-page .pannel-05 .body .right{
        height: auto;
        position: static;
        width: 100%;
        padding: 20px 10%;
        transform: translateY(0);
    }
    .footer{
        padding: 0 5%;
    }
    .home-page .swiper-body .left{
        width: 100%;
        padding: 20px 10%;
    }
    .openclass-page .banner-text .tit_ff, .exhibition-page .banner-text .tit_ff, .onshow-page .banner-text .tit_ff{
        font-size: 32px;
        width: 100%;
    }
    .form-box button, .onshow-content button{
        width: 25vw;
    }
    .exhibition-content-title .left{
        padding: 20px 10%;
    }
    .batch-page-content .category-sub-list,
    .batch-page-content .category-list{
        width: 100%;
        overflow: auto;
    }

    .batch-page-content .category-sub-list{
        margin-bottom: 20px;
    }
    .batch-page-content .category-sub-list li{
        padding: 0;
        flex: 0 0 auto;
    }
    .batch-page-content .category-sub-list li a{
        padding: 0 20px;
    }
    .show-list {
        display: flex !important;
        width: 100%;
        box-sizing: border-box;
        padding: 0 20px;
        flex-wrap: wrap;
        gap: 2%;
        /* overflow: auto; */
    }
    .show-list  li{
        flex: 0 0 auto;
        margin-bottom: 20px;
        /* width: 48%; */
    }
    /* .show-list li a{
        width: 100%;
        background-size: 100% 100%;
        height: auto;
        padding: 30px 20px 5px 40px;
    } */
    .unesco-page .swiper-button-next, .unesco-page .swiper-button-prev{
        display: none;
    }
    .sub-title{
        display: flex;
    }
    .fifth-page-content .category-list{
        width: 100%;
        overflow: auto;
        margin-bottom: 20px;
        padding: 0;
    }
    .category-list li{
        padding: 0 20px;
        flex: 0 0 auto;
    }
    .detail-page .detail-item{
        padding: 20px 0;
        box-sizing: border-box;
    }

    .header .header-body{
        width: 100%;
    }

    .footer-content {
        width: 100%;
    }
    .home-page .pannel-02 .right .list li{
        align-items: normal;
    }
    .home-page .pannel-02 .right .list{
        justify-content: space-between;
        padding: 0 20px 20px;
    }
    .onshow-pannel .tit_66, .onshow-panne2 .tit_66{
        padding: 20px 0;
    }

    #sub-cat-image{
        width: 100%;
        overflow: auto;
        flex-wrap: nowrap;
        margin-top: 20px;
    }
    #sub-cat-image li{
        flex: 0 0 auto;
    }
    .steps-box .steps-item .steps-item-left a svg{
        display: none;
    }
    .projectintro-pannel .left{
        padding: 0;
        margin-bottom: 20px;
    }
    .projectintro-pannel .right{
        width: 100%;
    }
    .projectintro-pannel .right img{
        width: 100%;
    }
    .home-page .pannel-02 .left{
        display: none;
    }
    .m-city-box{
        width: 100%;
        margin-bottom: 20px;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        position: relative;
        justify-content: space-between;
    }
    .m-city-box.collapsed{
        height: 106px;
        overflow: hidden;
    }
    .m-city-box.collapsed #collapse-btn{
        position: absolute;
        bottom: 0;
        right: 0;
    }
    .m-city-box li{
        width: 116px;
        height: 48px;
        flex: 0 0 auto;
        background-color: #fff;
        line-height: 48px;
        text-align: center;
        color: #9a7b4a;
        
    }
    .m-city-box li.active{
        background-color: #9a7b4a;
        color: #fff; 
    }
    .unesco-detail-page .panel-1 img{
        width: 100%;
        height: auto;
    }
    .home-page .pannel-05 .body .left img{
        margin-bottom: 20px;
        width: 100%;
    }
    .home-page .pannel-04 .tit_66{
        margin-bottom: 20px;
    }
    .exhibition-page {
        min-height: auto;
    }

    .batch-page-content .category-list>li a {
        width: 224px;
        height: 88px;
        background-size: contain !important;
        padding: 32px 0 0 48px;
    }

    .batch-page-content .category-list>li span:nth-child(2) {
        font-size: 20px;
    }



    .pannel_01 .list li.style2 .left, .pannel_01 .list li.style3 .left, .pannel_01 .list li.style4 .left{
        display: block;
    }
    .section-content{
        padding: 0;
    }
    .section-content .title{
        font-size: 16px;
    }
    .section-body .years-banner{
        height: 400px !important;
    }
    .years-banner .content p:nth-child(1){
        font-size: 24px;
    }
    .years-banner .content p:nth-child(2){
        font-size: 42px;
    }
    .years-banner .content p:nth-child(3){
        font-size: 16px;
    }
    .years-home-container img{
        width: 100%!important;
    }
    .section-body .pannel_01,
    .section-body .pannel_02,
    .section-body .pannel_03{
        padding-bottom: 45px;
    }
    .pannel_01 .list li.style2 .left .img1,
    .pannel_01 .list li.style2 .left .img2,
    .pannel_01 .list li.style3 .left .img1,
    .pannel_01 .list li.style3 .left .img2,
    .pannel_01 .list li.style4 .left .img1,
    .pannel_01 .list li.style4 .left .img2{
        width: 100%;
        background-position: center;
    }
    .pannel_01 .list li{
        display: block;
    }
    .pannel_01 .list li .left .img{
        height: 400px;
        width: 100%!important;
        margin-bottom: 10px;
        /* background-size: contain; */
    }
    .section3 .pannel_01 .list li .left .img{
        height: 260px;
        background-position: center;
    }
    .section3 .pannel_01 .style6 .left,
    .section3 .pannel_01 .style6 .right{
        width: 100%;
    }
    .section3 .pannel_01 .style6{
        padding-bottom: 0px;
    }
    .pannel_01 .list li .left{
        width: 100%!important;
        padding-top: 20px;
    }
    .pannel_01 .list li .right{
        box-sizing: border-box;
        width: 100%;
        padding: 20px
    }
    .pannel_01 .list li.style7 .img-list .img span{
        height: auto;
    }
    .pannel_01 .list li.style7 .left{
        padding: 20px;
        box-sizing: border-box;
    }
    .pannel_01 .list li.style7{
        padding: 0px 0;
    }
    .pannel_01 .list li.style7 .img-list .img img{
        width: 100%;
    }
    .pannel_01 .list li.style7 .img-list .img .des{
        margin-bottom: 10px;
    }
    .years-sub-title{
        width: 100%;
    }
    .pannel_02 .list-content{
        display: block;
    }
    .pannel_02 .list-content .left{
        width: 100%;
    }
    .pannel_02 .list-content .right{
        margin-left: 0;
    }
    .pannel_02 .list-content .right .img-list{
        margin-bottom: 20px;
    }
    .pannel_02 .style2 .list-content .left{
        width: 100%;
    }
    .pannel_02 .list .list-title{
        font-size: 14px;
    }
    .pannel_02 .style2 .list-content .right{
        margin-left: 0;
    }
    .pannel_02 .list-content .right .img-list:nth-child(1),
    .pannel_02 .list-content .right .img-list:nth-child(2){
        width: 100%;
    }
    .pannel_03 .list li{
        display: block;
    }
    .pannel_03 .list .style1 .left{
        width: 100%;
    }
    .pannel_03 .list .left a{
        margin: 20px 0;
    }
    .pannel_03 .list .style1 .right{
        display: block;
        width: 100%;
    }
    .pannel_03 .list .style1 .right .img-list{
        margin-bottom: 20px;
    }
    .pannel_03 .list .style2 .left{
        display: block;
        width: 100%;
        height: auto;
    }
    .pannel_03 .list .style2 .left .img-list{
        position: relative !important;
        margin-bottom: 20px;
    }
    .pannel_03 .list .style2 .right{
        width: 100%;
    }

    /* 首页 */
    .mySwiper2 {
        width: 100%;
    }
    .years-show-list .list-01{
        width: 100%;
    }
    .tabs-pannel .item-1,
    .tabs-pannel .item-2{
        width: 100%;
    }
    .tabs-pannel .item-2{
        padding-top: 20px;
        padding-bottom: 10px;
    }
    .tabs-pannel .text-list{
        margin-top: 30px;
    }
    .type-list{
        margin-left: 20px;
    }
    .years-home-swiper{
        width: 100%;
    }
    .tabs-pannel .swiper-slide img{
        height: 200px;
        object-fit: cover;
    }
    .pag-box {
        margin-top: 30px;
    }
    .home-pannel-title{
        font-size: 24px;
    }
    .home-list .left,
    .home-list .right{
        width: 100%;
        
    }
    .pannel_03 .home-list .home-sub-title, .pannel_02 .home-list .home-sub-title,
    .home-list .home-sub-title{
        height: auto;
        width: 100%;
        background: none;
        text-align: center;
        margin-bottom: 20px;
    }
    /* .pannel_01 .home-list, */
    .pannel_02 .home-list,
    .pannel_03 .home-list,
    .pannel_02 .home-list,
    .pannel_02 .home-list,
    .pannel_02 .home-list{
        padding-top: 20px;
    }
    .home-list .home-sub-title span,
    .pannel_02 .home-list .home-sub-title span, .pannel_03 .home-list .home-sub-title span{
        transform: translateY(0);
        display: inline;
    }
    .pannel_01 .home-list{
        padding-bottom: 20px;
    }
    .home-list .home-sub-title span{
        width: 100%;
        position: static;
    }
    .years-home-container .pannel_01,
    .years-home-container .pannel_02,
    .years-home-container .pannel_03,
    .years-home-container.pannel_04,
    .years-home-container.pannel_05,
    .years-home-container.pannel_06,
    .years-home-container.pannel_07,
    .years-home-container.pannel_08{
        height: auto;
    }
    .pannel_02 .tit-list{
        display: flex;
        flex-wrap: wrap;
        padding-bottom: 20px;
    }
    .pannel_02 .tit-list li{
        width: 20%;
    }
    .years-home-container .pannel_03 .menu-list{
        width: auto;
        overflow: auto;
        transition: transform 0.3s ease;
    }
    .years-home-container .pannel_03 .menu-list li{
        width: 100px;
        flex: 0 0 auto;
    }
    .years-home-container .pannel_03 .tabs-list.bg4{
        background: #fff;
    }
    .years-home-container .pannel_03 .tabs-list{
        height: auto;
        padding: 20px 20px 20px;
        background-size: cover!important;
    }
    .pannel_03 .list .style1 .right .img-list .img{
        height: auto;
    }
    .pannel_01 .list li .left img,
    .pannel_03 .list .style1 .right .img-list .img img{
        width: 100%;
    }
    .years-home-container .pannel_03 .tabs-list .tabs-list-content .swiper-slide img{
        width: 100%;
        height: 240px;
    }
    .years-home-container .pannel_05,
    .years-home-container .pannel_06, .years-home-container .pannel_07{
        background-size: cover!important;
    }
    .years-home-container .pannel_05 ul,
    .years-home-container .pannel_07 ul{
        display: flex;
        flex-wrap: wrap;
    }
    .years-home-container .pannel_05 ul li,
    .years-home-container .pannel_07 ul li{
        width: 50%;
    }
    .pannel_03 .list .style2 .left .img-list .img{
        width: 100%;
    }
    .years-show-list-03{
        margin-top: 20px;
    }
    #tabs-list .tabs-list-content {
        float: none!important;
        width: 100%!important;
        margin: 0 auto!important;
    }
    .tabs-list-content .left,
    .tabs-list-content .right{
        width: 100%;
        margin-left: 0;
    }
    .pannel_bg .pannel_04 .home-pannel-title{
        margin: 30px 0;
    }
    .years-home-container .pannel_bg,
    .years-show-list{
        height: auto;
        background-size: cover!important;
    }
    .years-show-list .list-01,
    .years-show-list .list-02{
        position: relative;
    }
    .years-show-list .list-01 {
        width: 100%;
    }
    .years-show-list .list-02{
        height: auto;
        width: 100%;
        padding: 20px 10px;
    }
    .years-show-list-02 .content{
        /* width: 100%; */
        height: auto;
        padding: 0;
    }
    .years-show-list-02{
        margin-top: 30px;
    }
    .years-show-list-02 .left,
    .years-show-list.style2 .list-02{
        width: 100%;
        margin: 0;
        padding: 20px 10px;
    }
    .years-show-list-02 .left h5{
        margin-bottom: 20px;
    }
    .years-show-list-02 .right{
        width: 100%;
    }
    .years-show-list-02 .show-swiper-title{
        width: 100%;
        height: auto;
        padding: 10px;
    }
    .years-show-list.style2{
        height: auto;
        margin-top: 20px;
        padding: 0 20px;
    }
    .years-show-list.style2 .list-02{
        height: auto;
    }
    .years-show-list-03 .content{
        padding: 20px 10px;
        height: auto;
        background-size: cover!important;
        background-position: left center!important;
    }
    .years-show-list-03 .content .left,
    .years-show-list-03 .content .right{
        width: 100%;
        margin: 0;
        margin-bottom: 20px;
    }
    .years-home-container .pannel_05{
        padding-top: 20px;
        height: auto;
    }
    .years-home-container .pannel_05 ul li{
        margin-bottom: 20px;
    }
    .years-home-container .pannel_06,
    .years-home-container .pannel_07{
        height: auto;
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .section-body .img-list li{
        width: 100% !important;
    }
    .section-body .img-list li .img img{
        height: auto!important;
    }
    .pannel_01 .list li{
        margin-bottom: 10px;
    }
    .pannel_01 .list li.style5{
        padding-bottom: 0;
    }
    .section-content .title{
        padding: 20px 0;
    }
    .years-home-container .pannel_01 .right .img-box div{
        margin-bottom: 20px;
    }
}

@media screen and (max-width: 992px) {
    .content {
        max-width: 768px;
    }
    .pannel_02 .tit-list li p{
        font-size: 18px;
    }
    .logo {
        width: 33%;
    }
    .home-page .pannel-02 .right .list{
        gap: 2%;
    }
    .home-page .pannel-02 .right .list li{
        margin-bottom: 2%;
    }
    .home-page .pannel-02 .right .list li:nth-child(1){
        width: 62%;
    }
    .home-page .pannel-02 .right .list li:not(:nth-child(1)){
        width: 30%;
    }
   
    .home-page .tit-bg-box{
        display: none;
    }
    .project-list>li{
        width: 48%;
        margin: 0 0 20px;
    }
    .completed-content .project-list>li{
        width: 48%;
    }
    .years-home-container .pannel_06 .right .tip span{
        display: block;
        margin-bottom: 20px;
    }
     .show-list  li{
        flex: 0 0 auto;
        margin-bottom: 20px;
        width: 32%;
    }
    .show-list li a{
        width: 100%;
        background-size: 100% 100%;
        height: auto;
        padding: 15.3% 10.2% 2% 20.4%;
    }
}

@media screen and (max-width: 768px) {
    body{
        width: 100%;
        overflow: hidden;
    }
    .search-modal-content {
        width: 100%;
    }
    .years-organizers-list2 ul{
        width: 100%;
    }

    .index-swiper {
        /* max-height: 340px; */
    }

    .index-swiper img {
        /* max-height: 340px; */
        min-height: auto;
    }

    .container {
        padding-top: 70px;
    }

    .nav {
        /* height: 70px; */
    }

    .logo a {
        line-height: 70px;
    }

    .menu-list li {
        /* line-height: 70px; */
    }

    .menu-list li.menu-search {
        width: 70px;
    }

    .menu-list li.menu-search a {
        line-height: 70px;
    }

    .dropdown-more-menu {
        top: 70px;
    }

    .menu-more-bg {
        display: block;
    }

    .header .header-body {
        height: 70px;
    }

    .header .header-logo{
        margin-left: 10px;
    }

    .dropdown-menu {
        height: calc(100% - 70px);
    }

    .menu-close-btn {
        height: 70px;
    }

    .search-modal {
        top: 70px;
    }

    .menu-search-container {
        width: 70px;
    }

    .menu-close-btn img {
        margin: 26px auto;
    }

    .hide-menu {
        display: none;
    }

    .menu-more {
        display: inline-block;
    }

    .dropdown-more-menu li {
        opacity: 0;
        transform: translateY(-10px) scale(1.7);
        height: 78px;
        line-height: 78px;
        font-size: 28px;
        width: 100%;
        color: #333333;
        text-align: center;
    }

    .dropdown-more-menu li.child {
        padding-top: 16px;
        padding-bottom: 16px;
        height: 102px;
        background-color: #f3f3f3;
    }

    .dropdown-more-menu li.child a {
        font-size: 16px;
        height: 34px;
        line-height: 34px;
        display: block;
    }

    .dropdown-more-menu li:hover {
        color: #000000;
    }

    .dropdown-menu li {
        opacity: 1;
        transform: translateY(0px) scale(1);

        transition: transform 800ms cubic-bezier(0.19, 1, 0.22, 1) 0ms, opacity 800ms cubic-bezier(0.19, 1, 0.22, 1) 0ms;
        -moz-transition: transform 800ms cubic-bezier(0.19, 1, 0.22, 1) 0ms, opacity 800ms cubic-bezier(0.19, 1, 0.22, 1) 0ms;
        -o-transition: transform 800ms cubic-bezier(0.19, 1, 0.22, 1) 0ms, opacity 800ms cubic-bezier(0.19, 1, 0.22, 1) 0ms;
        -webkit-transition: transform 800ms cubic-bezier(0.19, 1, 0.22, 1) 0ms, opacity 800ms cubic-bezier(0.19, 1, 0.22, 1) 0ms;
    }

    .dropdown-menu li:nth-child(1) {
        transition-delay: 70ms;

    }

    .dropdown-menu li:nth-child(2) {
        transition-delay: 130ms;
    }

    .dropdown-menu li:nth-child(3) {
        transition-delay: 190ms;
    }

    .dropdown-menu li:nth-child(4) {
        transition-delay: 250ms;
    }

    .dropdown-menu li:nth-child(5) {
        transition-delay: 310ms;
    }

    .dropdown-menu li:nth-child(6) {
        transition-delay: 370ms;
    }

    .dropdown-menu li:nth-child(6) {
        transition-delay: 430ms;
    }

    .dropdown-menu li:nth-child(7) {
        transition-delay: 490ms;
    }

    .dropdown-menu li:nth-child(8) {
        transition-delay: 550ms;
    }

    .swiper-button-next,
    .swiper-button-prev {
        width: 45px;
        height: 45px;
    }

    .swiper-button-next:after,
    .swiper-button-prev:after{
        line-height: 45px;
    }

    .mobile-container {
        width: 89.33%;
        margin: 0 auto;
    }

    
    .footer-left {
        justify-content: center;
    }

    .footer-right a, .footer-right a:visited, .footer-right a:hover {
        width: 100px;
    }

    .footer-right {
        text-align: center;
    }

    .footer-info {
        height: 72px;
        line-height: 72px;
    }

    .capation {
        height: 150px;
        width: 100%;
        line-height: 150px;
    }

    .capation .content {
        width: 89.33%;
        margin: 0 auto;
    }

    .row {
        background-color: transparent;
    }

    .logo {
        width: 50%;
    }

    .modal-content {
        width: 80%;
    }

    .modal-body {
        padding: 20px 40px;
    }
    .tabs-pannel .text-list {
        flex-wrap: wrap;
    }
    .tabs-pannel .text-list li{
        width: 50%;
        flex: auto;
        margin-bottom: 20px;
    }
    /* .home-page .arrows{
        margin-right: 0;
        width: 100%;
    } */
    .home-page .swiper-btn-box{
        display: none;
        /* width: 30%;
        height: 40px; */
    }
    .swiper-button-next, .swiper-button-prev{
        display: none;
    }
    .tabs-pannel .swiper-button-next, .tabs-pannel .swiper-button-prev{
        display: block;
    }
    .home-page .pannel-02 .right .list li:nth-child(1) p:nth-child(1){
        font-size: 18px;
        text-align: left;
        margin-bottom: 12px;
    }
    #video-list li, #image-list li{
        width: 49%;
        height: auto;
        max-height: 163px;
    }
    .unesco-page .convention-swiper{
        height: 98vw;
    }
    .unesco-page .convention-swiper .swiper-slide{
        height: 46vw !important;
    }
    .unesco-page .convention-swiper .swiper-slide img{
        height: 100%;
    }
    .years-organizers-list.organizers-list li,
    .organizers-list li{
        width: 100%;
    }
    .show-list  li{
        flex: 0 0 auto;
        margin-bottom: 20px;
        width: 48%;
    }
    .show-list li a{
        width: 100%;
        background-size: 100% 100%;
        height: auto;
        padding: 16.3% 10.2% 4% 20.4%;
    }
    .show-list li a span{
        font-size: 18px;
    }
    .home-page .pannel-02 .right .list li:nth-child(1) p:nth-child(2){
        text-align: left;
    }
    .home-page .pannel-03 .body .left p:nth-child(1){
        font-size: 22px;
    }


    .pannel_02 .list-content .right{
        display: block;
    }
    .pannel_02 .style2 .list-content .right .img-list{
        width: 100%;
        margin-bottom: 20px;
    }
    .pannel_02 .tit-list li p{
        width: 70%;
        font-size: 16px;
    }
    .years-home-container .pannel_05 ul,
    .years-home-container .pannel_07 ul{
        display: block;
    }
    .years-home-container .pannel_05 ul li,
    .years-home-container .pannel_07 ul li{
        width: 100%;
    }
    
}

@media screen and (max-width: 568px) {
    .pannel_02 .tit-list li{
        width: 50%;
    }
    .capation {
        font-size: 32px;
    }

    .modal-content {
        width: 90%;
    }

    .modal-body {
        padding: 20px;
    }
    
    
    .unesco-detail-list li{
        width: 49%;
        padding-bottom: 20px;
    }
    .sub-title .notes{
        display: none;
    }
    .m-city-box{
        gap: 2%;
    }
    .m-city-box li{
        width: 32%;
        margin-bottom: 10px;
        font-size: 12px;
    }
    .m-city-box li#collapse-btn{
        margin-bottom: 0;
    }
    .home-page .pannel-03 .body .left p:nth-child(1){
        font-size: 14px;
    }

    .exhibition-list li p {
        padding: 5px 20px;
    }
}

@media screen and (max-width: 480px) {
    /* .menu-list li.menu-search {
        width: 75px;
    } */
    .unesco-page .convention-swiper{
        height: 98vw;
    }
    .dropdown-more-menu li {
        height: 60px;
        line-height: 60px;
        font-size: 24px;
    }

    .swiper-button-next,
    .swiper-button-prev {
        width: 32px;
        height: 32px;
    }

    .swiper-button-next:after,
    .swiper-button-prev:after{
        line-height: 32px;
    }


    .pure-form button[type=submit] {
        margin: 0;
    }

    .breadcrumbs {
        /* height: 70px;
        line-height: 70px; */
    }

    .logo img {
        width: 40px;
        height: 40px;
    }

    .logo .title {
        font-size: 14px;
    }
    
    .logo .sub-title {
        font-size: 10px;
    }

    .nav {
        /* height: 54px; */
    }

    .menu-list li.menu-search {
        width: 54px;
        line-height: 54px;
    }

    .menu-list li.menu-search a {
        line-height: 54px;
    }

    .container {
        padding-top: 54px;
    }

    .dropdown-more-menu {
        top: 54px;
    }

    .header .header-body {
        height: 54px;
    }

    .menu-search-container {
        width: 54px;
    }

    .dropdown-menu {
        height: calc(100% - 54px);
    }

    .detail-capation {
        top: 54px;
    }

    .search-modal {
        top: 54px;
    }

    .menu-close-btn {
        height: 54px;
    }

    .menu-close-btn img {
        margin: 18px auto;
    }

    .modal-body {
        padding: 10px;
    }
    .completed-content .project-list>li{
        width: 100%;
    }
}

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

    .header .menu>li {
        margin: 0 20px;
    }
    
    .index-swiper {
        /* max-height: 240px; */
    }

    .index-swiper img {
        /* max-height: 240px; */
        min-height: auto;
    }

    .modal-content {
        width: 95%;
    }


    .project-list{
        gap: 2%;
    }
    .project-list>li{
        width: 100%;
        margin: 0 0 20px;
    }
    .exhibition-list li p {
        padding: 0px 10px;
    }
}

@media screen and (max-width: 380px) {
    .form-box select, .onshow-content select{
        background-position: right 8px center;
        padding: 0 8px;
    }
}

@media screen and (max-width: 360px) {
    .header .menu>li {
        margin: 0 14px;
    }

    .unesco-page .convention-swiper .swiper-slide{
        height: 44vw !important;
    }

    .home-page .pannel-02 .right .list li:nth-child(1) p:nth-child(1){
        font-size: 16px;
    }

    .home-page .pannel-02 .right .list li:nth-child(1) p:nth-child(2) {
        font-size: 16px;
    }
}