@charset "UTF-8";
@media screen and (max-width: 1440px) {
    /*版面邊框*/
    .wrap {
        width: 1000px;
    }
    header nav>ul,
    footer .content {
        padding: 0 3%;
    }
    .ShareBox .wrap,
    .under_menu ul,
    .F_banner {
        padding-left: 5%;
        padding-right: 5%;
    }
}

@media screen and (max-width: 1366px) {
	
    /*圓形按鈕*/
    .circleBtn {
        width: 140px;
        height: 140px;
    }
    /*Footer*/
    footer .leftBox {
        padding-top: 20px;
        border-right: 1px solid #dedede;
    }
    footer .rightBox {
        border-left: none;
    }
    footer .leftBox .content .box {
        /*float: left;*/
    }
    footer .leftBox .logo {
        width: 140px;
    }
    footer .leftBox .logo,
    footer .leftBox .copyright {
        /*display: block;*/
    }
}

@media screen and (max-width: 1280px) {
    /*版面邊框*/
    .wrap {
        width: 100%;
        padding: 0 5%;
    }
    header nav>ul {
        padding: 0;
    }
    /*圓形按鈕*/
    .circleBtn {
        width: 140px;
        height: 140px;
    }
    /*Header*/
    header nav>ul>li>a {
        padding: 20px 0;
    }
    header nav>ul>li>a span,
    header nav>ul>li .subMenu>li>a span{
        font-size: 110%;
    }
    header .leftBox .logo {
        width: 250px;
        height: 64px;
    }
}

@media screen and (max-width: 1024px) {
    /*底下展開的網站導覽MENU選單*/
    .ShareBox .photo {
        display: none;
    }
    /*手機板時Header區塊*/
    header {
        position: fixed;
        top: 0;
        z-index: 1000;
        background-color: #93af30;
        box-shadow: 1px 1px 12px rgba(0, 0, 0, 0.2);
        height: auto;
        background: none;
        background-color: #93af30;
    }
    header>.topNav {
        padding: 0 !important;
        float: left;
        /*margin-left: 70px;*/
        margin-left: calc((100% - 246px)/2);
    }
    header>.topNav .leftBox {
        padding: 5px;
        box-sizing: border-box;
        position: static;
    }
    header>.topNav .leftBox .logo {
        width: 236px;
        height: 60px;
        background: url(../../images/icon/logo.svg) no-repeat center/contain;
    }
    header>.topNav .leftBox .info {
        display: none;
    }
    header>.topNav .rightBox {
        display: none;
    }
    /*手機板的按鈕開關*/
    .menuBtn {
        display: block;
        width: 70px;
        height: 70px;
        background: #7c9914;
    }
    .menuBtn>span,
    .menuBtn>span::before,
    .menuBtn>span::after {
        content: '';
        width: 40px;
        height: 5px;
        background-color: #fff;
        display: block;
        border-radius: 5px;
    }
    .menuBtn>span {
        position: relative;
        top: calc((70px - 5px)/2);
        left: calc((70px - 40px)/2);
    }
    .menuBtn>span::before {
        position: absolute;
        top: -13px;
    }
    .menuBtn>span::after {
        position: absolute;
        top: 13px;
    }
    /*結束*/
    /*首頁的旅遊資訊區塊*/
    .infoBox ul li a {
        background-position: center 0%;
        background-size: 60%;
    }
    /*搜尋工具*/
    .searchTools .searchSel {
        margin: 30px 0px;
        display: block;
    }
    .searchSel label {
        width: 140px;
        display: inline-block;
        float: left;
        text-align: left;
    }
    .searchTools input,
    .searchTools select {
        width: calc(100% - 140px);
        display: inline-block;
        text-align: left;
    }
    
    /**/
    .facebookLink{
        right: 1%;
        bottom: 3%;
    }
    .facebookLink a{
        width: 80px;
        height: 80px;
        padding: 0;
        border-radius: 100%;
        background: #3b5998 url(../../Images/icon/facebook.svg) no-repeat center/contain;
    }
    .facebookLink a span{
        display: none;
    }
    .facebookLink .autoBox{
        display: none;
    }
}

@media screen and (max-width: 960px) {
    /*底下展開的網站導覽MENU選單*/
    .under_box,
    .under_menu {

        display: none;
    }
    /*分享區塊*/
    .share_title {
        font-size: 1.5rem;
        line-height: 50px;
    }
    /*Footer*/
    footer .wrap {
        padding: 0 5%;
    }
    footer .leftBox {
        padding: 20px 0 0;
    }
    footer .rightBox {
        padding: 0 0 20px;
    }
    footer .leftBox,
    footer .rightBox {
        width: 100%;
        border: none;
    }
    footer .content {
        padding: 0 10px;
        text-align: center;
        position: static;
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
    footer .leftBox .content .box {
        display: inline-block;
        text-align: center;
        margin: auto;
        float: none;
    }
    footer .leftBox .logo,
    footer .leftBox .copyright {
        display: inline-block;
        text-align: left;
    }
    footer .leftBox .logo {
        width: 30%;
    }
    footer .rightBox .copyrightLink {
        padding-bottom: 0;
    }
    footer .rightBox .copyright {
        /*display: none;*/
    }
    footer .copyright a{
        margin: 10px auto;
    }
}

@media screen and (max-width: 768px) {
    /*首頁的旅遊資訊區塊*/
    .infoBox ul li {
        width: 33.3%;
        border-left: none;
    }
}

@media screen and (max-width: 767px) {
    /*手機板Header區塊*/
    header>.topNav {
        /*margin-left: 60px;*/
        margin-left: calc((100% - 207px)/2);
    }
    header>.topNav .leftBox .logo {
        width: 197px;
        height: 50px;
    }
    .menuBtn {
        width: 60px;
        height: 60px;
    }
    .menuBtn>span {
        top: calc((60px - 5px)/2);
        left: calc((60px - 40px)/2);
    }
    
    /*分享區塊*/
    .ShareBox .wrap {
        padding-top: 5%;
        padding-bottom: 5%;
    }
    .share_title {
        display: none;
    }
    /*BACK和TOP按鈕*/
    .otherBtn .backBtn,
    .otherBtn .topBtn {
        width: 60px;
        height: 60px;
        margin: 0 5px;
        background-position: center;
    }
    .otherBtn .backBtn>span,
    .otherBtn .topBtn>span {
        display: none;
    }
    /**/
    .facebookLink a{
        width: 60px;
        height: 60px;
    }
}

@media screen and (max-width: 640px) {
    /*Footer*/
    footer .leftBox .logo {
        width: 150px;
        height: 61px;
        display: block;
        margin: 0 auto 10px;
    }
    footer .copyright p{
        text-align: center;
    }
}

@media screen and (max-width: 480px) {
    /*手機板Header區塊*/
/*
    header>.topNav {
        margin-left: 50px;
    }
    header>.topNav .leftBox .logo {
        width: 157px;
        height: 40px;
    }
    .menuBtn {
        width: 50px;
        height: 50px;
    }
    .menuBtn>span {
        top: calc((50px - 5px)/2);
        left: calc((50px - 30px)/2);
    }
    .menuBtn>span,
    .menuBtn>span::before,
    .menuBtn>span::after {
        width: 30px;
        height: 4px;
    }
    .menuBtn>span::before {
        top: -10px;
    }
    .menuBtn>span::after {
        top: 10px;
    }
*/
    /*旅遊資訊區塊*/
    .infoBox ul li {
        width: 50%;
    }
    .infoBox ul li a {
        padding-bottom: 80%;
    }
    .infoBox ul li a span {
        font-size: 1rem;
    }
    /*網站錯誤回報連結(報馬仔)*/
    .webdebug .icon{
        margin-right: 0px;
    }
    .webdebug a{
        font-size: 1rem;
    }
    /*分享區塊*/
    .ShareBox ul li {
        margin: 0 5px;
    }
    .ShareBox ul li a {
        width: 40px;
        height: 40px;
    }
    /*交換Banner區塊*/
    .F_banner {
        padding: 30px 15px;
    }
    .F_banner ul li .auto span {
        font-size: 1rem;
    }
    /*BACK和TOP按鈕*/
    .otherBtn {
        right: 5px;
        bottom: 5px;
    }
    .otherBtn .backBtn,
    .otherBtn .topBtn {
        width: 50px;
        height: 50px;
        margin: 5px 0;
        float: none;
    }
    /**/
    .facebookLink a{
        width: 50px;
        height: 50px;
    }
}

@media screen and (max-width: 420px) {
    /*版面邊框*/
    .wrap {
        padding: 0 15px;
    }
    /*旅遊資訊區塊*/
    .infoBox .wrap {
        padding-top: 15px;
        padding-bottom: 15px;
    }
    /*搜尋工具*/
    .searchTools .searchSel {
        margin: 10px 0px;
    }
    .searchTools .searchSel label {
        display: block;
        text-align: left;
    }
    .searchTools input,
    .searchTools select {
        width: 100%;
    }
}
@media screen and (max-width: 370px) {
    /*網站錯誤回報連結(報馬仔)*/
    .webdebug .icon{
       display: none;
    }
    .webdebug a{
        font-size: 0.9rem;
    }
    /*旅遊資訊區塊*/
    .infoBox ul li a {
        padding-bottom: 85%;
    }
}