@media screen and (max-width: 1599px) {
    html {
        font-size: 16px;
    }

    /*-------------------------/
    footer
    --------------------------*/
    .footer-information .footer-contact {
        flex-wrap: wrap;
    }

    .footer-information .footer-contact {
        justify-content: flex-start;
    }

    .footer-information .footer-logo {
        width: 100%;
        margin-bottom: 2rem;
    }

    /*-------------------------/
    首頁
    --------------------------*/
    .index-page .entrance-box {
        justify-content: space-around;
    }

    .index-page .entrance-item {
        width: 25%;
    }

    /*-------------------------/
    規定及流程
    --------------------------*/
    .process .event-schedule .schedule-title::after {
        height: 600px;
        bottom: -600px;
    }

    .process .event-schedule .event-schedule-title {
        font-size: 2.5em;
    }
}



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

    /*-------------------------/
    選單
    --------------------------*/
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: 1rem;
        padding-left: 1rem;
    }

    /*-------------------------/
    footer
    --------------------------*/
    .footer-information .information-ul {
        flex-wrap: wrap;
    }

    .footer-information .information-ul li {
        width: 100%;
    }

    /*-------------------------/
    首頁
    --------------------------*/
    .index-page .entrance-item {
        width: 30%;
    }

    .index-page .figure {
        width: 350px;
    }

    /*****banner*****/
    .banner .island {
        width: 900px;
    }

    .banner .island .banner-bg04 {
        width: 485px;
    }

    .banner .banner-logo {
/*        width: 700px;*/
		transform:scale(0.9);
		
    }

    /*-------------------------/
    選項卡版型共用(說明內頁)
    --------------------------*/
    .tab-contact .contact {
        padding: 3rem 6rem 15rem 6rem;
    }

    /*-------------------------/
    規定及流程
    --------------------------*/
    .process .event-schedule .schedule-title {
        width: 100%;
        border-radius: 50px;
        height: auto;
        padding: 10px 0;
        margin-bottom: 30px;
    }

    .process .event-schedule .schedule-title::after {
        display: none;
    }

    .process .event-schedule .schedule-title {
        flex-direction: row;
        font-weight: bold;
        background-color: #dceff5 !important;
    }

    .process .event-schedule .schedule-contact {
        width: 100%;
        margin-left: 0;
    }

    .process .event-schedule .schedule-contact::before {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 17.5px 15px 17.5px;
        border-color: transparent transparent #808080 transparent;
        top: -16px;
        right: 0;
        margin: auto;
    }

    .process .event-schedule .schedule-contact ul:first-child {
        width: 100%;
        border-bottom: 1px solid #666;
        padding-bottom: 20px;
        margin-bottom: 20px;
    }

    .process .event-schedule .schedule-contact ul:last-child {
        width: 100%;
        padding-left: 0;
        border-left: 0;
    }

    .process .event-schedule .schedule-contact ul li {
        margin: 2px 0;
    }


}

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

    /*-------------------------/
    banner
    --------------------------*/




}

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

    /*-------------------------/
    選單(變換)
    --------------------------*/
    .navbar-toggler {
        border: 0;
    }
    .navbar-expand-lg .navbar-nav .nav-link {
        font-size: 1.4em;
    }
    .top-nav{
        padding: 1rem;
        margin-bottom: 0;
    }
    .top-nav li {
        font-size: 1.4em;
    }
    .dropdown-menu .dropdown-item {
        font-size: 1.4em;
        margin-left: 1.5em;
    }
    .dropdown-menu .dropdown-item a:before{
        content:"- ";
        color:#3a3a3a;
    }
    .web-size-ground .web-size {
        font-size: 1em;
    }
    button.navbar-toggler:focus {
        border: 4px solid #000;
    }

    /*logo*/
    .navbar .logo {
        width: 130px;
    }

    .navbar-toggler-icon {
        background-image: url('../images/toggler-icon.svg');
    }

    .top-nav li {
        margin-right: 20px;
    }

    /*-------------------------/
    首頁
    --------------------------*/
    .index-page {
        padding-top: 10rem;
        padding-bottom: 20rem
    }

    /*-------------------------/
    footer
    --------------------------*/
    .footer .footer-collapse,
    .footer .footer-collapse-con {
        display: none;
    }

    .footer.style .footer-collapse,
    .footer.style .footer-collapse-con {
        display: none;
    }

    /*-------------------------/
    首頁
    --------------------------*/


    .index-page .entrance-item {
        width: 30%;
    }

    .tab-contact .title {
        font-size: 2.4em;
        margin-bottom: 1em;
    }

    .tab-contact .contact .contact-title {
        font-size: 2.4em;
    }

    .index-page .entrance-item .text {
        font-size: 1.5em;
        padding: 20px 0;
    }


    .index-page .figure {
        width: 280px;
    }

    /*****banner*****/
    .banner {
        min-height: 70vh;
        min-height: calc(var(--vh, 1vh) * 80);
    }

    .banner .banner-bg02 {
        bottom: 30%;
    }

    .banner .island {
        width: 700px;
        padding: 180px 0 100px 0;
    }

    .banner .island .banner-bg04 {
        width: 400px;
        right: -95px;
        bottom: 269px;
    }

    .banner .banner-logo {
/*        width: 680px;*/
        bottom: 45px;
		transform:scale(0.85);
    }

    /*社群*/
    .community {
        top: 65px;
    }

    .community a {
        width: 35px;
        margin-bottom: 10px;
    }

    /*-------------------------/
    選項卡版型共用(說明內頁)
    --------------------------*/
    .tab-contact .contact {
        padding: 3rem 5rem 15rem 5rem;
    }

    .tab-contact .figure {
        width: 280px;
    }
}

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

    html {
        font-size: 87.5%;
    }

    /*-------------------------/
    選單(變換)
    --------------------------*/
    .top-nav li {
        margin-right: 10px;
    }

    /*-------------------------/
    共用
    --------------------------*/
    /**版面**/
    .page {
        padding: 7rem 0 0 0;
    }

    /**導覽**/
    .breadcrumb .breadcrumb-item {
        display: none;
    }

    .breadcrumb .breadcrumb-item.active {
        display: block;
    }

    .breadcrumb .breadcrumb-item a {
        padding: 5px 20px;
    }

    /*-------------------------/
    footer
    --------------------------*/
    .footer-information .footer-text {
        font-size: 1.2em;
    }

    .footer-information .footer-logo img {
        width: 200px;
    }

    .footer-information .footer-text .link a {
        padding: 0 5px 0 15px;
    }

    .footer-information .footer-text .link a::after {
        width: 8px;
        height: 13px;
    }

    /*-------------------------/
    首頁
    --------------------------*/
    .index-page {
        padding-top: 3rem;
        padding-bottom: 20rem
    }

    .index-page .entrance-box {
        flex-wrap: wrap;
    }

    .index-page .entrance-item {
        width: 60%;
        margin-bottom: 3rem;
        border-radius: 35px;
        box-shadow: 20px 20px 0px -10px rgba(51, 51, 51, 1);
    }

    .index-page .entrance-item img {
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
    }

    .index-page .entrance-item .text {
        font-size: 2em;
        border-bottom-left-radius: 30px;
        border-bottom-right-radius: 30px;
    }

    .index-page .figure {
        left: 30px;
        width: 150px;
    }

    .index-page::before {
        background-size: cover;
        background-position: right;
        top: 50%;
        width: 100%;
    }

    .index-page::after {
        background: url(../images/entrance-grassland-ph.png);
        background-repeat: no-repeat;
        background-position: bottom;
        background-size: contain;
    }

    /*****banner*****/

    .banner .island {
        width: 500px;
    }

    .banner .banner-logo {
/*        width: 500px;*/
		left: 20%!important;
		right: 20%!important;
		transform: scale(0.65) translate(-50%, -50%);
		bottom: -15%;


    }

    .banner .island .banner-bg04 {
        width: 324px;
        right: -90px;
        bottom: 201px;
    }

    /*社群*/
    .community {
        justify-content: end;
        margin-bottom: 30px;
    }

    .community-line {
        display: none;
    }

    /*-------------------------/
    選項卡版型共用(說明內頁)
    --------------------------*/
    .introduction {
        padding-bottom: 0;
    }

    .container-tab-contact {
        padding: 0;
    }

    .tab-contact .contact {
        padding: 3rem 3rem 10rem 3rem;
        box-shadow: inherit;
        border-bottom: 1px solid #ccc;
    }

    .tab-contact .tab li a {
        padding: 10px 0;
        font-size: 1em;
    }

    .tab-contact .title {
        font-size: 2em;
    }

    .tab-contact .contact .contact-title {
        font-size: 2em;
    }

    .tab-contact .contact .text {
        font-size: 1.3em;
    }

    .tab-contact .figure {
        width: 200px;
        left: 0;
    }

    /*-------------------------/
    規定及流程
    --------------------------*/
    .process .table-list-box {
        margin: 2rem 0 2rem 0;
    }
    .process .event-schedule .schedule-title {
        font-size: 1.5em;
    }

    /*-------------------------/
    規定及流程
    --------------------------*/
    .process .event-schedule .schedule-contact {
        padding: 1rem 2rem;
    }

    .process .event-schedule .schedule-contact ul li {
        line-height: 1.5;
    }

    .process .event-schedule .schedule-contact {
        border-radius: 20px;
    }

}

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

    html {
        font-size: 81.25%;
    }

    /*-------------------------/
    首頁
    --------------------------*/
    .index-page {
        padding-bottom: 13rem
    }

    /*****banner*****/
    .banner .island {
        width: 350px;
    }

    .banner .island .banner-bg04 {
        width: 195px;
        right: -45px;
        bottom: 180px;
    }

    .banner .banner-logo {
/*		transform: scale(0.45);*/
		left: 20%!important;
		right: 20%!important;
		transform: scale(0.45) translate(-50%, -50%);
		bottom: -15%;
/*        bottom: 62px;*/
    }

    /*-------------------------/
    選項卡版型共用(說明內頁)
    --------------------------*/
    .tab-contact .tab li a {
        font-size:0.875em;
        letter-spacing: -1px;
    }

    .tab-contact .contact {
        padding: 3rem 1rem 6rem 1rem;
    }

    .tab-contact .figure {
        width: 150px;
        left: 0;
    }

    .tab-contact .contact .text-title {
        font-size: 1.3em;
    }

    /*-------------------------/
    行前準備
    --------------------------*/
    .video .ratio {
        margin: 0 0 3rem 0;
    }

    /*-------------------------/
    規定及流程
    --------------------------*/
    .process .table-list-box .table>:not(caption)>*>* {
        padding: .1rem 0;
    }

    .process .event-schedule .schedule-contact::before {
        border-width: 0 14px 12px 14px;
        top: -13px;
    }

    .process .event-schedule .schedule-title {
        margin-bottom: 20px;
    }
}

@media screen and (max-width: 414px) {
	.banner .banner-logo {
		left: -10%!important;
		right: 0%!important;
		transform: scale(0.45) translate(-50%, -50%);
		bottom: -100px;

    }
}

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

    /*-------------------------/
首頁
--------------------------*/
    /*****banner*****/
	 .banner .banner-logo {
		left: 0%!important;
		right: 0%!important;
		transform: scale(0.2) translate(-50%, -50%);
		bottom: -15%;
/*        bottom: 62px;*/
    }
    .banner .island .banner-bg04 {
        width: 160px;
        right: -15px;
    }
}




/**
@media screen and (min-width: 576px) {

}
@media screen and (min-width: 768px) {

}
@media screen and (min-width: 992px) {

}
@media screen and (min-width: 1200px) {

}
**/

/* 屏幕分辨率放大為 150% */
@media (-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 120dpi) {
    html {
        zoom: 80%;
    }

    /* 修復 */
    .modal-backdrop {
        width: 100%;
        height: 100%;
    }
}

/* 屏幕分辨率放大為 125% */
@media (-webkit-min-device-pixel-ratio: 1.25) {
    html {
        zoom: 80%;
    }

    /* 修復 */
    .modal-backdrop {
        width: 100%;
        height: 100%;
    }
}

/* 屏幕分辨率放大為 110% */
@media (-webkit-min-device-pixel-ratio: 1.1) {
    html {
        zoom: 80%;
    }

    /* 修復 */
    .modal-backdrop {
        width: 100%;
        height: 100%;
    }
}