@media (max-width:1350px) {
    .hero-video{
        background-size: 100% 400px;
      }
    
}


@media  (max-width:1200px) {
    .nav-sm{
        display: block;
    }
    .nav-pc{
        display: none !important;
    }
    span.arrow-collapse{
        display: none;
    }
    .nav-sm-a{
        padding: 5px 5px 5px 40px!important;
    }

    .icon-menu {
        font-size: 2.75rem;
    }
  

    .park-link a::before {
        content: '';
        position: absolute;
        background: url(../img/park-17.png) no-repeat center / cover;
        right: -87px;
        top: -47px;
        width: 90px;
        height: 84px;
    }

    .park-link a::after {
        content: '';
        position: absolute;
        background: url(../img/park-18.png) no-repeat center / cover;
        right: -172px;
        top: -6px;
        width: 74px;
        height: 49px;
        animation: swing2 linear 2s infinite;
    }
    .fraud{
        height: 340px;
    }

    .f-img{
        width: 60%;
    }
    .site-navbar .site-logo a{
        width: 25%;
      }

    .site-navbar{
        height: 70px;
    }
    .nav-pt{
        padding-top: 10px;
    }

    .site-mobile-menu .site-nav-wrap > li{
        margin-bottom: 8px;
        padding-bottom: 10px;
        border-bottom: 1px dashed #dddddd;
        
    }

    .nav-pt{
        flex-direction: row;
    }

    .logo-block{
        margin-bottom: 0px;
    }

    .header-search-wrap{
        display: none;
    }

    .mobile-search{
        display: none;
        width: 240px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 40px;
      }
    

    /*麵包屑導覽列圖示*/
    .nav-deco1::before,
    .nav-deco2::before,
    .nav-deco3::before,
    .nav-deco4::before,
    .nav-deco5::before,
    .nav-deco6::before,
    .nav-deco7::before,
    .nav-deco8::before{
        display: block;
    }


    
.nav-deco{
    position: relative;
  }
  
  .nav-deco1::before{
    position: absolute;
    content: '';
    background: url(../img/nav-02.png) no-repeat center / cover;
    width: 50px;
    height: 50px;
    top: 50%;
    left: -59px;
    transform: translate(0%,-50%);
  }
  
  .nav-deco2::before{
    position: absolute;
    content: '';
    background: url(../img/nav-03.png) no-repeat center / cover;
    width: 50px;
    height: 50px;
    top: 50%;
    left: -59px;
    transform: translate(0%,-50%);
  }
  .nav-deco3::before{
    position: absolute;
    content: '';
    background: url(../img/nav-04.png) no-repeat center / cover;
    width: 50px;
    height: 50px;
    top: 50%;
    left: -59px;
    transform: translate(0%,-50%);
  }
  .nav-deco4::before{
    position: absolute;
    content: '';
    background: url(../img/nav-05.png) no-repeat center / cover;
    width: 50px;
    height: 50px;
    top: 50%;
    left: -59px;
    transform: translate(0%,-50%);
  }
  .nav-deco5::before{
    position: absolute;
    content: '';
    background: url(../img/nav-06.png) no-repeat center / cover;
    width: 50px;
    height: 50px;
    top: 50%;
    left: -59px;
    transform: translate(0%,-50%);
  }
  .nav-deco6::before{
    position: absolute;
    content: '';
    background: url(../img/nav-07.png) no-repeat center / cover;
    width: 50px;
    height: 50px;
    top: 50%;
    left: -59px;
    transform: translate(0%,-50%);
  }
  .nav-deco7::before{
    position: absolute;
    content: '';
    background: url(../img/nav-08.png) no-repeat center / cover;
    width: 50px;
    height: 50px;
    top: 50%;
    left: -59px;
    transform: translate(0%,-50%);
  }
  .nav-deco8::before{
    position: absolute;
    content: '';
    background: url(../img/nav-09.png) no-repeat center / cover;
    width: 50px;
    height: 50px;
    top: 50%;
    left: -59px;
    transform: translate(0%,-50%);
  }

  
  
  .site-mobile-menu .site-nav-wrap > li > a img{
    display: none;
  }



}


@media (max-width:992px) {

    .footer-text{
        flex-direction: column;
    }

    .waterfall{
        width: 100%;
        column-count: 2;
        column-gap: 10px;
    }
    

    .f-img{
        width: 80%;
    }

    /*學吧輪播圖隱藏*/
    .act-pic-none{
        display: none;
    }

    .act-nav{
        width: 100%;
    }

    /*良食園區圖片*/
    .agri-info-wrap{
        flex-direction: column;
    }

    .agri-info-txt{
        margin-left: 0px;
        margin-top: 80px;
    }

  

    /*最新消息*/
    .news-link{
        position: relative;
    }
    .news-more{
        position: absolute;
        right: 23px;
        bottom: 15px;
    }
   
    .c-pic{
        padding-left: 0px;
        padding-right: 0px;
      }

      /*創生園區*/
    
      

}

@media only screen and (min-width: 480px) and (max-width: 767px){
    .container {
        width: 470px;
    }
}


/*平板開始-------------------------------------*/
@media (min-width:768px) and (max-width:1024px) {

    .hero-video{
        background-size: 100% 300px;
      }


    header .col-10{
        padding-left: 0px !important;
    }

    .row{
        margin-left: 0px;
        margin-right: 0px;
    }

    h2{
        font-size: 2.8rem;
    }

    header .container{
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        max-width: 814px;
    }

    header .container .row{
        justify-content: space-between;
    }



    .site-navbar .site-logo{
        display: inline-block;
    }

    .site-navbar .site-logo a{
        width: 170px;
        height: 50px;
    }


    .footer-inner{
        padding-top: 20px;
    }

   

    /*首頁*/

    .travel-title{
        width: 40%;
    }


    .maplink{
        width: 90px;
    }

    #agri-park .row{
        flex-direction: column-reverse;
    }
    #agri-park .text-wrap, #agri-park .pic-wrap {
        width: 90%;
        margin-right: auto;
        margin-left:auto; 
    }

    #agri-park .text-wrap{
        margin-top: 0px;
    }

    #agri-park .title-block{
        justify-content: space-between;
    }

    .park-link a::before {
        content: '';
        position: absolute;
        background: url(../img/park-17.png) no-repeat center / cover;
        right: -128px;
        top: -34px;
        width: 110px;
        height: 91px;
    }

    .park-link a::after {
        content: '';
        position: absolute;
        background: url(../img/park-18.png) no-repeat center / cover;
        right: -225px;
        top: 7px;
        width: 74px;
        height: 49px;
        animation: swing2 linear 2s infinite;
    }

    .text-inner p:nth-child(2){
        margin-top: 20px;
        margin-bottom: 40px;
    }

    #news .title-block::before{
        height: 56px;
    }

    #news .container .row{
        display: flex;
        flex-direction: column;
    }

    .news-wrap{
        margin-left: 0px;
        margin-top: 40px;
    }

    .news-wrap ul{
        padding-left: 10px !important;
    }
    .news-wrap li a{
        font-size: 16px;
    }
    .news-wrap li a span:nth-child(1){
        font-size: 14px;
    }
   
    .news-title-deco::after{
        width: 109px;
        height: 98px;
        bottom: -35px;
        left: 147px;
      }



    .now div:nth-child(2){
        margin-left: 12px;
    }
    .now div:nth-child(3){
        margin-left: 12px;
    }

    .footer-inner .col-sm-12 figure{
        width: 60%;
        margin-left: auto;
        margin-right: auto;
    }

    .footer-item:nth-child(1){
        margin-top: 0px;
    }
    .footer-item:nth-child(2){
        justify-content: space-evenly;
    }

    .footer-inner .row{
        justify-content: space-evenly;
    }

    .footer-info:nth-child(1),
    .footer-info:nth-child(2)
    {
        width: 46%;
    }

    .footer-info:nth-child(3){
        margin-top: 50px;
        width: 100%;
    }

    .direct-line{
        justify-content: center;
    }

    /*學吧*/
    .dobar-item{
        margin-bottom: 30px;
    }

    .dobar-item-pic{
        width: 90%;
    }

    .dobar-item-pic img{
        height: auto;
    }

    .item-01 h5::after {
        width: 364px;
        height: 71px;
        top: -60px;
    }

    .item-02 h5::after{
        width: 160px;
        height: 68px;
        top: -60px;
    }

    .item-03 h5::after{
        width: 110px;
        height: 80px;
        top: -60px;
    }

    .item-01 .dobar-item-pic::after,
    .item-02 .dobar-item-pic::after,
    .item-03 .dobar-item-pic::after{
        font-size: 100px;
        top: -27px;
        left: -44px;
    }
    .dobar-item-txt p{
        font-size: 1rem;
    }

    .calendar-bg .row{
        flex-direction: column;
        align-items: center;
    }

    .calendar-bg .calendar-wrap, .calendar-bg .entry-wrap{
        width: 90%;
    }

    #color-calendar{
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .color-calendar.glass .calendar__header,
    .color-calendar.glass .calendar__weekdays,
    .color-calendar .calendar__days{
        grid-template-columns: repeat(7, minmax(20px, 70px));
    }


    /*農村廚房*/
    .kitchen-item-pic{
        width: 100%;
    }
    .kitchen-item-pic1::after {
        width: 200px;
        height: 160px;
        bottom: -29px;
        right: -30px;
    }
    .kitchen-item-pic2::after {
        width: 200px;
        height: 160px;
        bottom: -29px;
        left: -30px;
    }


    /*聊吧頁面----------------*/
    .chatbar-item-pic, .chatbar-item-txt{
        width: 90%;
    }
    .chatbar-item-pic1::after {
        width: 200px;
        height: 160px;
        bottom: -29px;
        right: -30px;
    }
    .chatbar-item-pic2::after {
        width: 200px;
        height: 160px;
        bottom: -29px;
        left: -30px;
    }

    /*冬山小旅行*/
    .first::before{
        width: 93px;
        height: 29px;
        top: -36px;
        left: -23px;
        transform: rotate(352deg);
    }

    .start::after,.spot1::after,
    .spot2::after,.spot3::after,
    .spot4::after{
        width: 180px;
        height: 180px;
    }

    .start::after,.spot2::after,.spot4::after{
        right: -20px;
        bottom: -70px;
    }
    .spot1::after, .spot3::after{
        left: -20px;
        bottom: -70px;
    } 

    .travel-slider-wrap::before{
        width: 250px;
        height: 62px;
        top: -70px;
    }
    /*聯絡我們*/
    .c-map {
        padding-bottom: 30%;
    }

    /*創生園區*/
    .agri-logo{
        width: 60%;
        margin-left: auto;
        margin-right: auto;
    }
    .bar-pic{
        width: 25%;
    }

    .park-img img{
        width: 300px;
        height: 300px;
    }

    .park-liquid-bg{
        width: 400px;
        height: 400px;
    }

    .park-liquid-bg-1::before{
        top: 0px;
    }

    .p-decoline{
        height: 60px;
    }
    

    /*學吧dialog*/
    .bar-content-item img{
        width: 25%;
    }




    .news-link{
        position: relative;
    }
    .news-more{
        position: absolute;
        right: 23px;
        bottom: 15px;
    }


    .cd-img img {
        border-radius: 3px;
        width: 30%;
    }

}


/*手機開始-------------------------------------*/
@media (max-width:767px) {

    .tf-info-wrap{
        width: 85%;
        height: 260px;
    }

    .tf-info-wrap::before {
        position: absolute;
        content: '';
        background: url(../img/tf-title.png) no-repeat center /contain;
        width: 90%;
        height: 100px;
        top: -50px;
        left: 50%;
        transform: translateX(-50%);
    }


    .playbar-pic-sm{
        display: block;  
    }
    .playbar-pic{
        display: none;  
    }




    .footer-text .jil{
        display: none;
    }

    .album-wrap{
        width: 49%;
        margin-bottom: 30px;
        padding-left: 10px;
        padding-right: 10px;
      }

      .waterfall{
        width: 100%;
        column-count: 1;
        column-gap: 10px;
    }

    .park {
        width: 90%;
        max-width: 90%;
    }


    .park::before{
        width: 440px;
        height: 43px;
    }

    
    .row{
        margin-left: 0px;
        margin-right: 0px;
    }

    h2{
        font-size: 2.65rem;
    }

    h4{
        font-size: 1.95rem;
    }

    h3{
        font-size: 2.25rem !important;
    }

    p{
        font-size: 16px;
    }

    li{
        font-size: 1.5rem;
    }

    .lh{
        line-height: 1.8;
    }

    .card span{
        font-size: 0.9rem;
    }

    .site-navbar .site-logo{
        display: inline-block;
    }

    .site-navbar .site-logo a{
        width: 150px;
        height: auto;
    }

    header .container{
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        max-width: 640px;
    }

    header .container .row{
        justify-content: space-between;
    }

    .footer-info{
        width: 100%;
    }

    .footer-info:nth-child(3){
        display: none !important;
        
    }

    .direct-line{
        flex-direction: column;
        align-items: center;
    }
    .direct-line p{
        margin-right: 0px;
        padding-right: 0px;
      }
      .direct-line p:nth-child(2),
      .direct-line p:nth-child(3){
        padding-left: 0px;
       border-left:unset ;
      }

      .footer-info figure{
        margin-left: auto;
        margin-right: auto;
      }

      .a-icon-group{
        text-align: center;
      }
    
    /*首頁*/
    .pc{
        display: none;
    }

    .sm{
        display: block !important;
    }

    .hero-video{
        width: 90%;
    }

    

    .hero .sm{
        display: block;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    #About .sm{
        display: table;
    }

    

    .maplink{
        width: 100px;
    }
    
    .maplink.buybar{
        top: 7%;
        left: 31%;
    }
    
    .maplink.chatbar {
        top: 42%;
        left: 13%;
    }
    
    .maplink.learnbar {
        top: 30%;
        left: 40%;
    }

    .maplink.kitchen {
        top: 50%;
        left: 39%;
    }
    
    .maplink.playbar {
        top: 28%;
        left: 60%;
    }


    .maplink.plantbar {
        top: 55%;
        left: 60%;
    }
    

    #agri-park .row{
        flex-direction: column-reverse;
    }

    #agri-park .text-wrap, #agri-park .pic-wrap {
        width: 98%;
        margin-right: auto;
        margin-left:auto; 
    }


    .text-inner p:nth-child(1){
        margin-top: 40px;
    }

    .text-inner p:nth-child(2){
        margin-top: 20px;
        margin-bottom: 40px;
    }

    #Agri .page-bg{
        background: url(../img/v9351.png) no-repeat center top  /cover;
    }

    .title-block::before{
        left: -15px;
        height: 60px !important;
    }

    .title-block {
        letter-spacing: 2px;
    }    

    .more-link{
        font-size: 18px;
    }

    #agri-park .title-block{
        margin-top: 100px;
    }
    #agri-park .pic-wrap > img {
        margin-top: 20px;
    }

    #agri-park .title-block img{
        width: 80px;
    }

    #news .title-block::before{
        height: 56px;
    }

    #news .container .row {
        display: flex;
        flex-direction: column;
    }

    .news-wrap{
        margin-left: 0px;
        margin-top: 40px;
        margin-bottom: 30px;
    }

    .news-wrap ul{
        padding-left: 10px !important;
    }

    .news-wrap ul li{
        padding-bottom: 12px;
        border-bottom: 1px dashed #edecea;
    }

    .news-wrap li a{
        font-size: 16px;
        flex-direction: column;
        align-items: flex-start;
    }
    .news-wrap li a span:nth-child(1){
        font-size: 14px;
    }

    .news-other span:nth-child(2){
        margin-left: 24px !important;
    }
    .news-block-title{
        font-size: 18px;
        margin-top: 12px;
    }

    #news .container .row .more-link{
        padding-top: 50px;
    }

    .arrow-wrap{
        margin-top: 15px;
    }

    #news .wave {
        width: 100%;
        bottom: -38px;
    }

    .news-title-deco::after{
        width: 92px;
        height: 87px;
        bottom: -36px;
        left: 134px;
      }



    .fraud{
        height: 450px;
    }

    .f-img{
        width: 50%;
    }


    #travel{
        padding-top: 60px;
    }

    .travel-title{
        width: 70%;
    }

    #travel .travel-text {
        font-size: 15px;
        line-height: 1.8;
        margin-top: 20px;
    }

    #travel .container .row{
        margin-top: 65px !important;
    }
    .travel-title::before {
        left: -44px;
        bottom: -78px;
        width: 73px;
        height: 73px;
    }
    #travel .travel-text::before {
        left: 3px;
        top: -105px;
        width: 100px;
        height: 74px;
    }
    .travel-title::after {
        right: -61px;
        bottom: -131px;
        width: 79px;
        height: 86px;;
    }
    #travel .travel-text::after {
        display: none;
    }
    .travel-pic-item{
        height: 200px;
    }
    .travel-pic-item img{
        height: 100%;
        width: 100%;
        object-fit: cover;
    }

    .footer-item{
        flex-direction: column;
        text-align: center;
    }

    .footer-item:nth-child(1){
        margin-top: 40px;
    }

    .footer-item-inner{
        margin-left: 0px;
        margin-top: 20px;
        border-top: 1px solid #ededec;
        padding-top: 20px;
    }

    .footer-inner{
        padding-top: 10px;
    }

    .direct-line{
        margin-bottom: 20px;
    }

    /*頁面背景設定*/
    .page-bg{
        height: 220px;
    }

    .page-bg h3 {
        font-size: 2.45rem !important;
    }
    .page-title {
        padding: 6px;
    }

    .page-bg span{
        font-size: 15px;
    }

    .page-title {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        background-color: #00000039;
        padding: 12px;
        text-align: center;
    }

    /*關於我們*/

    .vlr{
        writing-mode: unset !important;
    }
    .about1-txt-wrap{
        flex-direction: column;
    }
    .about1-txt {
        margin-left: 0px !important;
    }
    .about1-txt p{
        text-align: justify;
    }
    .underline{
        font-size: 1.85rem;
        line-height: 1.35;
    } 

    .timeline-wrap .col-8{
        width: 100% !important;
        max-width: unset !important;        
        flex: unset !important;
    }

    .now {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .now div:nth-child(1), 
    .now div:nth-child(2), 
    .now div:nth-child(3){
        width: 300px;
        height: 300px;
    }

    .timeline-wrap figure{
        width: 90%;
        margin: 20px auto;
    }

    /*最新消息*/

   
    .news-row{
        flex-direction: column;
        align-items: flex-start


    }

    #CATEGORY{
        width: 110px;
        font-size: 15px;
    }

    .news-item{
        flex-direction: column;
    }

    .news-pic{
        margin-bottom: 12px;
    }

    .news-item-info{
        margin-bottom: 12px;
    }

    .news-item-info, .news-item-txt{
        margin-left: 0px !important;
    }

    .news-item-txt h5{
        font-size: 1.05rem;
    }

    .breadcrumb{
        padding: 0px !important;
    }

    #News-page h4{
        font-size: 1.85rem;
    }
    .news-page-time{
        font-size: 14px;
    }


    .news-link{
        position: relative;
        margin-bottom: 40px;
    }
    .news-more{
        position: absolute;
        right: 23px;
        bottom: 15px;
        font-size: 15px;
    }

    .news-frame{
        flex-direction: column;
        align-items: center;
    }
    .news-img{
        width: 100%;
    }
    .news-img img{
        height: 200px;
    }
    .news-info{
        width: 100%;
        padding-left: 0px;
        margin-top: 20px;
    }

    /*創生園區*/

    #Agri h4{
        font-size: 1.75rem;
        letter-spacing: 2px;
    }

    /*創生園區*/
    .agri-logo{
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }

    .agri-info-wrap{
        margin-top: 60px;
        flex-direction: column;
    }

    .agri-info-pic{
        width: 90%;
    }

    .agri-info-txt{
        margin-top: 65px;
        margin-left: 0px;
    }

    .agri-info-txt strong{
        white-space: nowrap;
    }

    .park-img img{
        width: 300px;
        height: 300px;
    }
    .park-liquid-1,
    .park-liquid-3{
        flex-direction: column;
        align-items: center;
    }
    .park-liquid-2,
    .park-liquid-4{
        flex-direction: column-reverse;
        align-items: center;

    }

    .park-img:nth-child(1),
    .park-img:nth-child(3){
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: -40px;
    z-index: 1;
    }

    .park-img:nth-child(2),
    .park-img:nth-child(4){
    margin-top: 0px;
    margin-left: 0px;
    margin-bottom: -40px;
    z-index: 1;
    }
    
    .park-liquid-bg-1,
    .park-liquid-bg-2,
    .park-liquid-bg-3,
    .park-liquid-bg-4{
        padding: 30px 15px 10px 15px;
    }

    .park-liquid-bg{
        width: 100%;
    }

    .park-liquid-bg-1::before{
        bottom: 0;
        top: unset;
        transform: scaleX(-1);
        left: unset;
        right: 0;
    }
    .park-liquid-bg-2::before{
        top: 49px;
    }
    .park-liquid-bg-4::before{
        bottom: -10px;
    }
    .park-liquid-bg-3::before{
        bottom: 9px;
    }

    .p-decoline{
        height: 45px;
    }

    .p-decoline::before{
        display: none;
    }

    .p-decoline::after{
        width: 70px;
        height: 44px;
        right: 20px;
        top: -29px;
    }

    .park-liquid-bg-2{
        height: 340px;
    }

    .park-liquid-bg-3{
        height: 330px;
    }


    .bar{
        padding: 30px 5px;
        margin-top: 90px !important;
    }

    .bar-pic{
        margin-top: 20px;
        width: 40%;
    }

    .bar-info{
        padding: 12px;
    }

    .agri-link-wrap{
        margin-top: 80px !important;
    }

    

    /*學吧*/

    .act-date-wrap{
        flex-direction: column;
    }

    .act-date-item{
        width: 100%;
        border-bottom: 1px dashed #d5cac0;
        padding-bottom: 30px;
        margin-bottom: 30px;
    }

    #color-calendar{
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .calendar-bg .calendar-wrap, .calendar-bg .entry-wrap{
        width: 100%;
    }

    .check-out-wrap{
        margin-left: 0.5rem !important;
    }

    .wire-transfer img{
        width: 90% !important;
    }

    .event-left div:nth-child(1){
        margin-left: 0 !important;
    }

    .event-left div:nth-child(2){
        margin-right: 0 !important;
    }

    .check-out-wrap textarea{
        width: 100%;
    }

    .dobar-item{
        flex-direction: column;
    }

    .dobar-item-pic{
        width: 80%;
    }

    .dobar-item-pic img{
        height: auto;
        margin-bottom: 30px;
    }

    .dobar-item-txt p{
        font-size: 1rem;
    }
    .item-01 h5::after {
        content: '';
        position: absolute;
        background: url(../img/far-34.png) no-repeat center /cover;
        width: 280px;
        height: 45px;
        top: -49px;
        left: -8px;
    }

    .item-02 h5::after{
        width: 150px;
        height: 66px;
        top: -56px;
        left: 0;
    }
    .item-03 h5::after{
        width: 100px;
        height: 71px;
        top: -55px;
        left: 0;
    }

    .item-01 .dobar-item-pic::after,
    .item-02 .dobar-item-pic::after,
    .item-03 .dobar-item-pic::after{
        font-size: 80px;
        left: -36px;
        top: -24px;
        right: 0;
    }

    .dobar-item-txt{
        width: 90%;
        margin-left: 0px !important;
    }
    .dobar-item{
        margin-bottom: 0px;
    }

    .diy-slick-item img{
        height: 300px;
    }

    .reserve{
        width: 90%;
    }

    /*農村廚房*/
    .kitchen-item-pic{
        width: 100%;
    }

    .kitchen-item-pic img{
        height: unset;
    }

    .kitchen-item-pic1::after {
        width: 120px;
        height: 120px;
        bottom: -29px;
        right: -15px;
    }
    .kitchen-item-pic2::after {
        width: 120px;
        height: 120px;
        bottom: -29px;
        left: -15px;
    }

    .kitchen-link{
        margin-bottom: 80px;
    }

    
    /*聊吧頁面----------------*/
    .chatbar-item-pic, .chatbar-item-txt{
        width: 100%;
    }
    .chatbar-item-pic1::after {
        width: 120px;
        height: 120px;
        bottom: -29px;
        right: -15px;
    }
    .chatbar-item-pic2::after {
        width: 120px;
        height: 120px;
        bottom: -29px;
        left: -15px;
    }


    /*玩吧*/
    .play-item{
        flex-direction: column;
    }
    
    .play-item-txt{
        margin-left: 0px !important;
        width: 90%;
        margin-top: 20px;
    }

    .play-item-txt p{
        font-size: 1.55rem;
        text-align: justify;
    }


    /*冬山小旅行*/

    .travel-info {
        width: 90%;
    }

    .travel-info h3{
        font-size: 1.15rem;
    }

    .travel-info h3::after{
        width: 100%;
    }

    .travel-info p{
        font-size: 16px;
    }

    .Start::after,.Spot1::before,
    .Spot2::after,.Spot3::after{
        display: none;
    }

    .day-trip-info{
        flex-direction: column;
        margin-bottom: 100px;
    }
    .day-trip-info:nth-child(1){
        margin-top: 80px;
    }

    .day-trip-info:nth-child(1),
    .day-trip-info:nth-child(3),
    .day-trip-info:nth-child(5){
        flex-direction: column-reverse;
    }

    .day-trip-time-wrap:nth-child(1){
        justify-content: unset !important;
    }

    .day-trip-time-wrap{
        margin-top: 80px;
    }
    .day-trip-time-wrap, .day-trip-pic{
        width: 100%;
    }

    .start::after,.spot2::after,.spot4::after{
        width: 140px;
        height: 140px;
        right: -15px;
        bottom: -60px;
    }

    .spot1::after, .spot3::after{
        width: 140px;
        height: 140px;
        left: -15px;
        bottom: -60px;
    }

    .day-trip-time-wrap h5{
        font-size: 1.75rem;
        letter-spacing: 1px;
    }

    .day-trip-time-wrap span{
        font-size: 14px;
    }

    .day-trip-time-wrap p{
        font-size: 15px;
        text-align: justify;
    }

    .first::before{
        width: 88px;
        height: 28px;
        top: -44px;
        left: -12px;
        transform: rotate(0deg);
    }


    .day-trip-time-wrap:nth-child(2),
    .day-trip-time-wrap:nth-child(4){
        margin-top: 120px;
        margin-left: 0px !important;
    }

    .day-trip-info:nth-child(5){
        margin-bottom: 150px;
    }

    .travel-slider-wrap::before{
        width: 240px;
        height: 52px;
        top: -70px;
    }

    .travel-slider-item-text h5{
        font-size: 1.75rem;
    }

    .travel-slider-item-text p{
        font-size: 15px;
    }

    .apply-txt{
        background-color: #42a994d5;
    }

    .apply-txt h3{
        font-size: 1.25rem;
    }

    .apply{
        border-radius: 0px;
    }
    .apply-txt{
        bottom: 100px;
        border-top-right-radius: 0px;
    }

    .apply-txt p{
        font-size: 15px;
    }

    .travel-slider-item img, .travel-slider-item-text{
        width: 90%;
    }

    /*聯絡我們*/
    .c-map {
        padding-bottom: 50%;
    }

    .c-info ul{
        margin-top: 12px !important;
        padding-left: 0px !important;
    }

    /*農會服務*/

    #Service h5{
        font-size: 1.8rem;
    }

    #Service ol, #Service ul{
        padding-left: 15px;
    }

    #menu1 .service-item-inner ul li{
        font-size: 16px;    
    }

    #menu2 .card-link{
        margin-right: 20px;
    }

    #menu2 .card-link, .service-page .card-link{
        font-size: 18px;
        
    }

    #menu4 .card-header .card-link::after{
        top: 13px;
    }

    #collapse9 .sm table{
        width: 100%;
    }
    #collapse9 .sm table thead{
        background-color: #d0e1df;
        font-weight: 600;
        letter-spacing: 1px;
        vertical-align: middle;
        text-align: center;
    }

    #collapse9 .sm table thead > tr > td{
        font-size: 15px !important;
    }

    #collapse9 .sm table td{
        font-size: 14px;
        text-align: center;
    }

    #collapse9 .sm table td i{
        color: #42a995;
    }

    /*購物車dialog*/
    .cart-dialog-img{
        width: 80px;
        height: 80px;
        margin-right: 20px;
    }

    .cart-detail h5{
        font-size: 16px;
    }
    .cart-detail span{
        font-size: 14px !important;
    }

    header .col-10{
        padding-left: 0px !important;
    }

    .map_dialog .bar-icon{
        width: 50%;
        margin-bottom: 30px;
    }

    .bar-content-item{
        flex-direction: column;
    }

    .do-img, .kitchen-img{
        width: 98%;
    }

    .kitchen-img::after{
        width: 150px;
        height: 150px;
        right: -20px;
        bottom: -50px;
    }

    .do-img::after{
        width: 150px;
        height: 150px;
        left: -20px;
        bottom: -50px;
    }

      .do-ul{
        margin-top: 5px;
        padding-left: 5px;
      }
      
      .do-ul li{
       white-space: nowrap;
      }

      .modal-body .row{
        padding: 0px;
      }

      /*學吧dialog*/
    .bar-content-item img{
        width: 35%;
    }

    /*聯絡我們*/
    .c-info ul li{
        font-size: 16px;
        padding-bottom: 8px;
    }
      
    .cd-img{
        margin-left: 0;
        justify-content: space-around;
    }

    .cd-img img:nth-child(1), .cd-img img:nth-child(2){
        width: 45%;
    }

    .cd-img img:last-child{
        width: 97%;
        margin-left: auto;
        margin-right: auto;
        margin-top: 12px;
    }

} 


/*首頁地圖*/
@media (max-width:560px) {

    .maplink{
        width: 80px;
    }

    .maplink.chatbar {
        top: 39%;
        left: 13%;
    }

    .maplink.buybar {
        top: 7%;
        left: 33%;
    }
    
    .maplink.kitchen {
        top: 50%;
        left: 41%;
    }

    .maplink.learnbar {
        top: 28%;
        left: 41%;
    }

    .maplink.playbar {
        top: 25%;
        left: 60%;
    }

    .purple{
        font-size: 13px;
    }
    .promotion{
        padding-bottom: 80px;
    }

    #News .form-inline label{
        font-size: 15px;
    }


    /*良食農創園區*/

    #agri-park .text-wrap{
        margin-top: 0px;
    }

    .park-title {
        width: 90%;
        position: relative;
    }
    .text-inner p:nth-child(1){
        margin-top: 20px;
    }
    
}


@media (max-width:576px){

    .tf-slick-item img{
        height: 400px;
    }

    .tf-info-wrap{
        position: relative;
        width: 100%;
        border-radius: 0px;
        top: 0;
        left: 0;
        transform: translate( 0, 0);
        background: #000;
    }

    .tf-info-wrap p{
        font-size: 16px !important;
    }


    .album-wrap{
        width: 100%;
        margin-bottom: 30px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .waterfall{
        width: 100%;
        column-count: 1;
        column-gap: 10px;
    }


    .park::before{
        width: 367px;
        height: 36px;
        top: -19px;
    }
    .park-row{
        padding: 10px 10px 30px 10px;
    }

    .park-slick-wrap{
        width: 120px;
        height: 120px;
        bottom: -48px;
        right: -22px;
    }
 
    .park-slick img{
        height: 110px;
    }

    .page-bg{
        height: 160px;
    }


}


@media (max-width:500px){
    .park::before{
        width: 312px;
        height: 36px;
        left: 17px;
        background: url(../img/d-park2.png) no-repeat center /cover;
    }
    
}



@media (max-width:480px){
    .park{
        width: 94%;
        margin-left: auto;
        margin-right: auto;
    }

    .fraud{
        height: 400px;
    }

    .f-img{
        width: 75%;
    }

    .pro-title-deco::before{
        display: none;
    }
    .pro-title-deco::after{
        background: url(../img/title-deco-05.png) no-repeat center /cover;
        animation: unset;
        width: 100%;
        height: 30px;
        top: 0;
        left: 50%;
        transform: translate(-50%,-141%);
    }

   
}


@media (max-width:460px){
    .site-mobile-menu .site-nav-wrap > li > ul > li > a{
        padding-left: 0px;
        margin-left: 37%;
    }

    .site-mobile-menu .site-nav-wrap > li > ul > li > ul > li > a{
        margin-left: 23%;
    }

    .nav-sm-a{
        padding-left: 5px !important;
    }



    #agri-park .pic-wrap::before{
        width: 180px;
        height: 40px;
    }
    .park-link a::before {
        right: -117px;
        top: -58px;
        width: 107px;
        height: 98px;
        animation: swing2 linear 2s infinite;
    }

   

    .text-inner p:nth-child(1){
        font-size: 18px;
    }

    .text-inner p:nth-child(2){
        font-size: 16px;
    }


    .news-link{
        position: relative;
    }

    .news-frame{
        padding: 15px 15px 30px 15px;
    }
   
    .news-info p{
        font-size: 15px;
    }
    .news-img span, .date-branch{
        font-size: 12px;
    }


    .date-branch span:nth-child(3){
        margin-top: 6px;
    }
    .news-more{
        font-size: 14px;
        font-weight: 600;
        bottom: 10px;
        position: absolute;
      }
    
      #News .container .col-12{
        padding-left: 0;
        padding-right: 0;
      }
      .news-img span{
        bottom: 16px;
      }

      .park-link a::after{
        display: none;
    }
}



@media (max-width:400px) {

    #travel .container .row{
        margin-top: 30px !important;
    }
    .travel-title::before {
        left: -53px;
        bottom: -44px;
        width: 64px;
        height: 64px;
    }
    #travel .travel-text::before {
        left: 3px;
        top: -70px;
        width: 89px;
        height: 54px;
    }
    .travel-title::after {
        right: -54px;
        bottom: -65px;
        width: 64px;
        height: 69px;
    }



    .maplink{
        width: 65px;
    }

    /* .maplink.chatbar {
        top: 59%;
        left: 11%;
    }

    .maplink.buybar {
        top: 35%;
        left: 31%;
    }

    .maplink.learnbar {
        top: 52%;
        left: 40%;
    }

    .maplink.kitchen {
        top: 67%;
        left: 39%;
    }

    .maplink.playbar {
        top: 51%;
        left: 59%;
    }

    .maplink.plantbar {
        top: 69%;
        left: 60%;
    } */


    .delete-btn{
        margin-right: 0;
    }
    

    .delete-btn a{
        font-size: 14px;
    }

    .cart-dialog-img{
        width: 60px;
        height: 60px;
        margin-right: 15px;
    }

    #cart-dialog .quantity{
        width: 60px;
    }

    .map-close{
        width: 50px;
        height: 50px;
    }

    .do-img, .kitchen-img{
        width: 100%;
    }

    .kitchen-img::after{
        width: 120px;
        height: 120px;
        right: -12px;
        bottom: -70px;
      }

      .do-img::after{
        width: 120px;
        height: 120px;
        left: -12px;
        bottom: -70px;
      }

      .park::before{
        width: 255px;
        height: 27px;
        left: 17px;
    }
    .park::after{
        font-size: 14px;
        right: 12px;
    }

    .park-link a::before {
        right: -84px;
        top: -64px;
        width: 85px;
        height: 77px;
        animation: swing2 linear 2s infinite;
    }

    #travel .bold{
        margin-bottom: -5px;
        font-size: 18px;
    }

    .park-link a::after{
        display: none;
    }
    
}