/* -- reset module8 -- */
.edit,
.show_content,
.main_part { width: 100% !important; max-width: 100% !important; margin: auto !important; padding: 0px !important;}
.pageIndex .main_part { border:none !important; }
.path,
.banner { display:none;}
/* -- reset module8 end -- */


.hs_box * { line-height:150%; font-size:15px; border:0; outline:none; text-decoration:none; padding:0; margin:0; list-style:none; box-sizing:border-box; max-width:100%; font-family: '微軟正黑體'; 
-webkit-transition: ease .4s; -moz-transition: ease .4s; -ms-transition: ease .4s; -o-transition: ease .4s; transition: ease .4s;}
.hs_box{overflow: hidden;scroll-behavior: smooth;background-color: #ffffff00;max-width: 2000px;margin: auto;}
.hs_box sub, .hs_box sup{vertical-align: unset;}
.hs_box i, .hs_box em , .hs_box dfn , .hs_box var{font-style: normal;line-height: 0px;}/*斜線標籤轉正*/
.hs_box table{border-spacing: 0px;border-collapse: collapse;}
.hs_box table td{border: 1px solid #000;}
.hs_box img { max-width:100%;line-height: 0px;}
.hs_clear::before, .hs_clear::after { content:''; display: table; }
.hs_clear::after { clear: both;}
.hs_clear { zoom: 1; }

/*Animations*/
[data-animate-in] { opacity: 0; transition: transform 1.6s ease, opacity 1.6s ease;}
[data-animate-in="up"] { transform: translate3d(0, 10px, 0);}/*由下往上*/
[data-animate-in="left"] { transform: translate3d(-5%, 0, 0);}/*由左往右*/
[data-animate-in="right"] { transform: translate3d(5%, 0, 0);}/*由右往左*/
[data-animate-in="down"] { transform: translate3d(0, -10%, 0);}/*由上往下*/
[data-animate-in="fadeIn"] { transform: translate3d(0, 0, 0);}/*淡入*/
[data-animate-in="scaleIn"] {transform: scale(.3);}/*放大淡入*/
[data-animate-in="rotateIn"] {transform: scale(.3) rotate(-10deg);}/*放大淡入*/
[data-animate-in].in-view { opacity: 1; transform:translate3d(0,0,0) rotate(0deg); -webkit-transform:translate3d(0,0,0) rotate(0); transition: transform .8s ease, opacity .8s ease;}
.fade-in { opacity: 0; transition: opacity .5s ease; }
/*Animations-end*/

/*關鍵字*/
.key_words{height: 0; max-height: 0; overflow: hidden;}
.key_words h2, .key_words h3, .key_words h4, .key_words h5, .key_words h6{color: rgba(255,255,255,.0);}

    body{
        background: url(../images/new_all_bg.jpg);
        background-position: center;
        background-size: cover;
        background-attachment: fixed;
    }

    .hs_box{
        --f120:120px;
        --f80:80px;
        --f60:60px;
        --f30:30px;
        --f25:25px;
        --f23:23px;
        --f20:20px;
        --f17:17px;
        --f15:15px;
        --colorpurple:#474A66;
        --colorpurplelight:#7F839D;
        --colorgreen:#4C5D03;
        --colorgreenlight:#91915E;
    }

    @keyframes effect01 {
        50%{transform: rotate(-3deg) translateX(5px);}
    }
    @keyframes effect02 {
        1%{opacity: 1;}
        100%{left: calc(2000%);opacity: 1;}
    }
    @keyframes effect03 {
        50%{filter: brightness(1.05);transform: scale(0.8);}
    }

    /*首頁*/
    .noi_a{
        padding: calc(2vw + 70px) 5%;
        position: relative;
        z-index: 1;
    }
    .noi_a > img:nth-of-type(1){
        position: absolute;
        top: 5%;
        left: -3vw;
        z-index: -1;
        width: clamp(150px, 40vw, 950px);
    }
    .noi_a > img:nth-of-type(2){
        position: absolute;
        top: 0px;
        right: -8vw;
        z-index: -1;
        width: clamp(120px, 30vw, 650px);
        animation: effect01 4s infinite linear;
    }
    .noi_a > img:nth-of-type(3){
        position: absolute;
        top: clamp(120px, 30vw, 650px);
        right: -12vw;
        z-index: -1;
        width: clamp(100px, 25vw, 550px);
        animation: effect01 6s infinite linear;
    }
    .noi_a01{
        display: flex;
        justify-content: flex-end;
        align-items: flex-start;
    }
    .noi_a01 section{
        width: 600px;
        margin: 5vw 5% 0 0;
    }
    .noi_a01 section p{
        display: block;
        font-size: var(--f17);
        margin: 25px 0;
    }
    .noi_a01 section span{
        display: block;
        max-width: fit-content;
        padding: 5px 10px;
        background-color: var(--colorgreenlight);
        border-radius: 500px;
        font-size: var(--f17);
        color: #fff;
        line-height: 120%;
    }
    .noi_a01 ul{
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .noi_a01 ul li:nth-of-type(2){
        margin: 4vw 0 0;
    }
    .noi_a01 ul li:nth-of-type(3){
        margin: 8vw 0 0;
        padding: 0 0 0 10px;
    }
    .noi_a02{
        max-width: 1600px;
        margin: 0 auto 0;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    .noi_a02 > i{
        display: block;
        min-width: fit-content;
        margin: 0 30px 0 0;
    }
    .noi_a02 dl{
        width: 675px;
    }
    .noi_a02 dl dt{
        font-size: var(--f25);
        color: var(--colorpurple);
        line-height: 120%;
        padding: 0 0 10px;
        border-bottom: 1px solid var(--colorpurple);
    }
    .noi_a02 dl dd{
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
        margin: 15px 0 0;
    }
    .noi_a02 dl dd p{
        font-size: var(--f17);
        line-height: 160%;
        margin: 5px 0;
    }
    .noi_a02 dl dd p s{
        display: inline-block;
        line-height: 160%;
        font-size: var(--f17);
    }
    .noi_a02 dl dd section{
        border-left: 1px solid var(--colorpurple);
        margin: 0 0 0 30px;
        padding: 0 0 0 30px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .noi_a02 dl dd section a{
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 5px;
        border-radius: 10px;
    }
    .noi_a02 dl dd section a em{
        display: block;
        min-width: fit-content;
        margin: 0 15px 0 0;
    }
    .noi_a02 dl dd section a em img{
        width: clamp(40px, 5vw, 60px);
    }
    .noi_a02 dl dd section a b{
        font-size: var(--f17);
        color: var(--colorpurple);
        letter-spacing: 0.1em;
        line-height: 120%;
        font-weight: 600;
    }
    .noi_a02 dl dd section a:hover{
        box-shadow: 1px 1px 1px var(--colorpurplelight);
        filter: drop-shadow(1px 1px 1px var(--colorpurplelight));
        -webkit-filter: drop-shadow(1px 1px 1px var(--colorpurplelight));
    }

    .noi_b{
        padding: calc(6vw + 30px) 5% calc(6vw + 70px);
        background: url(../images/home/no_bg01.jpg);
        background-position: center left;
        background-size: cover;
        position: relative;
        z-index: 1;
    }
    .noi_b::after{
        content: '';
        background-color: #000;
        width: 50px;
        height: 30px;
        z-index: -1;
        position: absolute;
        top: 99%;
        left: clamp(5%, 9vw, 200px);
        clip-path: polygon(50% 100%, 0 0, 100% 0);
    }
    .noi_b01{
        max-width: 1600px;
        margin: auto;
        position: relative;
        z-index: 1;
        padding: 0 20% 0 0;
    }
    .noi_b01 > h4{
        font-size: var(--f80);
        color: #fff;
        line-height: 120%;
        word-break: break-word;
        font-weight: normal;
    }
    .noi_b01 > h5{
        font-size: var(--f25);
        color: #fff;
        line-height: 120%;
        letter-spacing: 0.2em;
        margin: 10px 0 30px;
        font-weight: normal;
    }
    .noi_b01 > span{
        display: block;
        font-size: var(--f20);
        color: #fff;
        line-height: 120%;
    }
    .noi_b01 > i{
        display: block;
        width: 35px;
        margin: 50px 0;
    }
    .noi_b01 > p{
        font-size: var(--f17);
        color: #fff;
        line-height: 140%;
        letter-spacing: 0.05em;
        margin: 30px 0 0;
    }
    .noi_b01 > a{
        display: flex;
        justify-content: center;
        align-items: center;
        width: clamp(70px, 15vw, 200px);
        height: clamp(70px, 15vw, 200px);
        border-radius: 500px;
        border: 1px solid #fff;
        background-color: rgba(255, 255, 255, .3);
        font-size: var(--f17);
        color: #fff;
        letter-spacing: 0.1em;
        position: absolute;
        bottom: 0px;
        right: 0px;
    }
    .noi_b01 > a:hover{
        background-color: var(--colorgreen);
        transform: scale(0.95);
    }

    .noi_c{
        padding: 0 0 0 5%;
    }
    .noi_c01{
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        margin: -5vw 0 0 auto;
        max-width: 1800px;
    }
    .noi_c01 section{
        width: 600px;
        margin: 0 8% 80px 0;
    }
    .noi_c01 section h4{
        font-size: var(--f80);
        color: var(--colorpurplelight);
        line-height: 120%;
        word-break: break-word;
        font-weight: normal;
    }
    .noi_c01 section h5{
        font-size: var(--f25);
        line-height: 120%;
        letter-spacing: 0.2em;
        margin: 10px 0 30px;
        font-weight: normal;
    }
    .noi_c01 section span{
        display: block;
        font-size: var(--f20);
        line-height: 120%;
        margin: 40px 0 calc(2vw + 40px);
    }
    .noi_c01 section p{
        font-size: var(--f17);
        line-height: 140%;
        letter-spacing: 0.05em;
        margin: 30px 0 0;
    }
    .noi_c01_owl{
        max-width: 940px;
    }
    .noi_c01_owl *{
        max-width: unset;
    }
    .noi_c01_owl .item{
        padding: 15px;
        background-color: #fff;
    }
    .noi_c01_owl .owl-dots{
        display: none;
    }
    .owl-theme .owl-nav{
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    .owl-carousel .owl-nav button{
        width: 50px;
        height: 50px;
        background-color: var(--colorgreenlight) !important;
        display: flex !important;
        justify-content: center;
        align-items: center;
    }
    .owl-carousel .owl-nav button:before{
        width: 14px;
        height: 25px;
    }
    .owl-carousel .owl-nav button:nth-of-type(1):before{
        content: '';
        line-height: 0px;
        background: url(../images/home/no_icon03.png);
    }
    .owl-carousel .owl-nav button:nth-of-type(2)::before{
        content: '';
        background: url(../images/home/no_icon03.png);
        line-height: 0px;
        transform: rotate(180deg);
    }
    .owl-carousel .owl-nav button:hover{
        background-color: var(--colorgreen) !important;
    }
    .owl-carousel .owl-nav button span{
        display: none;
    }
    .noi_c02{
        max-width: 1800px;
        margin: 50px 0 0 auto;
    }
    .noi_c02 > a{
        width: 100px;
        height: 100px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 500px;
        border: 1px solid var(--colorpurple);
        background-color: #fff;
        font-size: var(--f17);
        font-weight: bold;
        color: var(--colorpurple);
        line-height: 120%;
        letter-spacing: 0.1em;
        position: relative;
        z-index: 1;
    }
    .noi_c02 > a::after{
        content: '';
        height: 1px;
        background-color: var(--colorpurple);
        width: 2000px;
        position: absolute;
        top: 50%;
        left: clamp(15px, 120%, 120%);
        z-index: -1;
        transform: translateY(-50%);
        pointer-events: none;
    }
    .noi_c02 > a:hover{
        background-color: var(--colorpurple);
        color: #fff;
    } 
    .noi_c02 > a::before{
        content: '';
        height: 8px;
        width: 8px;
        background-color: var(--colorpurplelight);
        border-radius: 500px;
        position: absolute;
        top: calc(50% - 4px);
        left: clamp(15px, 120%, 120%);
        opacity: 0;
        z-index: -1;
        pointer-events: none;
    }
    .noi_c02 > a:hover::before{
        animation: effect02 10s infinite;
    }
    .noi_c03{
        padding: 50px 5%;
        position: relative;
        z-index: 1;
    }
    .noi_c03 > img:nth-of-type(1){
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%,-50%);
        z-index: -1;
        width: clamp(200px, 60vw, 1110px);
    }
    .noi_c03 > img:nth-of-type(2){
        position: absolute;
        top: 0px;;
        right: -30px;
        z-index: -1;
        width: clamp(100px, 25vw, 575px);
    }
    .noi_c03 section{
        max-width: 980px;
        margin: auto;
    }
    .noi_c03 section h4{
        font-weight: normal;
        font-size: var(--f120);
        color: var(--colorpurple);
        line-height: 120%;
        max-width: fit-content;
        word-break: break-word;
    }
    .noi_c03 section dl{
        display: flex;
        justify-content: flex-end;
        align-items: flex-start;
        transform: translateX(10px);
    }
    .noi_c03 section dl dd{
        min-width: clamp(70px, 7vw, 120px);
        height: clamp(70px, 7vw, 120px);
        background-color: var(--colorpurplelight);
        border-radius: 500px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: var(--f60);
        color: #fff;
        line-height: 120%;
        margin: 0 20px 0 0;
    }
    .noi_c03 section dl dt{
        font-size: var(--f120);
        color: var(--colorpurple);
        line-height: 120%;
    }
    .noi_c03 section dl dt s{
        display: block;
        font-size: var(--f25);
        color: var(--colorpurple);
        line-height: 120%;
        letter-spacing: 0.2em;
        font-weight: 500;
    }
    .noi_c03 figure{
        display: flex;
        justify-content: flex-end;
        align-items: flex-end;
        max-width: 1500px;
        margin: -7vw 0 0;
        transform: translateX(6vw);
    }
    .noi_c03 figure i{
        display: block;
        text-align: right;
        padding: 0 30px 5vw 0;
        min-width: 300px;
    }
    .noi_c03 figure i img{
        display: inline;
    }
    .noi_c03 figure i img:nth-of-type(1){
        width: 36%;
    }
    
    /*----------------------------------------*/

    /*營區守則*/
    .nor_a{
        padding: 70px 0;
        width: clamp(0px, 90%, 1600px);
        margin: auto;
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        position: relative;
        z-index: 1;
    }
    .nor_a section{
        width: 640px;
        margin: 0 30px 0 0;
    }
    .nor_a section h4{
        font-weight: normal;
        font-size: var(--f120);
        color: var(--colorpurple);
        line-height: 120%;
        word-break: break-word;
    }
    .nor_a section h4 s{
        margin: 0 0 0 15px;
        position: relative;
        z-index: 1;
        display: inline-block;
        font-size: var(--f120);
        color: var(--colorpurplelight);
        line-height: 120%;
    }
    .nor_a section h4 s::after{
        content: '';
        width: clamp(30px, 5vw, 75px);
        height: clamp(30px, 5vw, 75px);
        position: absolute;
        top: -5px;
        left: -15px;
        border-radius: 500px;
        background-color: #ECE9DC;
        z-index: -1;
        animation: effect03 3s infinite linear;
    }
    .nor_a section h5{
        font-size: var(--f30);
        line-height: 120%;
        letter-spacing: 0.1em;
        font-weight: normal;
        margin: 15px 0 50px;
    }
    .nor_a section h6{
        font-size: var(--f25);
        color: var(--colorgreenlight);
        line-height: 120%;
        font-weight: 600px;
        border-left: 4px solid var(--colorgreenlight);
        padding: 0 0 0 10px;
        margin: 40px 0 20px;
    }
    .nor_a section h6 s{
        display: inline-block;
        font-size: var(--f25);
        color: var(--colorgreenlight);
        line-height: 120%;
    }
    .nor_a section dl{
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 0 0 8px;
    }
    .nor_a section dl dt{
        min-width: 110px;
        background-color: var(--colorgreenlight);
        color: #fff;
        margin: 0 5% 0 0;
        font-size: var(--f17);
        padding: 2px 5px;
        text-align: center;
        letter-spacing: 0.05em;
    } 
    .nor_a section dl dd{
        font-size: var(--f20);
        color: #000;
        line-height: 120%;
    }
    .nor_a section > article{
        padding: 10px;
        background-color: #DDDDDD;
        font-size: var(--f17);
        line-height: 160%;
        max-width: 500px;
        margin: 15px 0 0;
    }
    .nor_a section > p{
        font-size: var(--f17);
        line-height: 160%;
    }
    .nor_a section > p a{
        display: inline-block;
        color: #E3661A;
        font-size: var(--f20);
        font-weight: bold;
        padding: 2px 5px;
    }
    .nor_a section > p a:hover{
        background-color: #E3661A;
        color: #fff;
    }
    
    .nor_b{
        width: clamp(0px, 90%, 1600px);
        margin: auto;
        display: grid;
        grid-template-columns: 1fr;
        row-gap: 70px;
    }
    .nor_b01{
        width: 100%;
        background-color: #fff;
        border-radius: clamp(20px, 5vw, 50px);
        padding: 70px 5%;
    }
    .nor_b01 > section{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        max-width: 1290px;
        margin: auto;
    }
    .nor_b01 > section i{
        display: block;
        min-width: fit-content;
        margin: 0 20px 0 0;
        position: relative;
        z-index: 1;
        line-height: 0px;
    }
    .nor_b01 > section i::before{
        content: '';
        height: 1px;
        width: 2000px;
        background-color: var(--colorgreenlight);
        position: absolute;
        top: calc(50% + 5px);
        right: 100%;
        z-index: -1;
        transform: translateY(-50%);
    }
    .nor_b01 > section h4{
        font-size: var(--f30);
        color: var(--colorgreenlight);
        letter-spacing: 0.2em;
        line-height: 120%;
    }
    .nor_b01 > section h4 s{
        display: block;
        font-size: var(--f20);
        color: var(--colorgreenlight);
        line-height: 120%;
        font-weight: normal;
        letter-spacing: 0em;
        padding: 5px 0 0;
    }
    .nor_b01 > dl{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        max-width: 1290px;
        margin: 50px auto 0;
    }
    .nor_b01 > dl dt{
        width: 445px;
        text-align: center;
    }
    .nor_b_con01,
    .nor_b_con02,
    .nor_b_con03{
        width: 100%;
        max-width: 725px;
        margin: 0 0 0 5%;
    }
    .nor_b_con01 p{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        font-size: var(--f20);
        color: #000;
        margin: 15px 0;
    }
    .nor_b_con01 p s{
        min-width: 160px;
        padding: 2px 5px;
        background-color: var(--colorgreenlight);
        text-align: center;
        font-size: var(--f20);
        color: #fff;
        margin: 0 20px 0 0;
    }
    .nor_b_con02 > b{
        display: block;
        max-width: 115px;
        background-color: var(--colorgreenlight);
        text-align: center;
        font-size: var(--f20);
        color: #fff;
        padding: 2px;
        font-weight: normal;
        margin: 0 0 10px;
    }
    .nor_b_con02 > span{
        display: block;
        font-size: var(--f20);
    }
    .nor_b_con02 > ul{
        margin: 20px 0;
    }
    .nor_b_con02 > ul li{
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 10px 0;
    }
    .nor_b_con02 > ul li s{
        min-width: 30px;
        height: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: var(--f20);
        color: #fff;
        background-color: var(--colorgreenlight);
        margin: 0 15px 0 0;
    }
    .nor_b_con02 > ul li p{
        font-size: var(--f20);
        line-height: 160%;
    }
    .nor_b_con02 > em{
        display: block;
        max-width: fit-content;
        padding: 3px 10px;
        background-color: #E3661A;
        font-size: var(--f20);
        color: #fff;
        line-height: 120%;
    }
    .nor_b_con03 ul{
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: wrap;
    }
    .nor_b_con03 ul .nor_30{
        width: 30%;
    }
    .nor_b_con03 ul .nor_70{
        width: 70%;
    }
    .nor_b_con03 ul ol,
    .nor_b_con03 ul li{
        padding: 15px 5%;
        border: 1px solid var(--colorgreenlight);
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    .nor_b_con03 ul ol{
        background-color: var(--colorgreenlight);
        font-size: var(--f25);
        color: #fff;
        line-height: 120%;
    }
    .nor_b_con03 ul li{
        background-color: #fff;
        font-size: var(--f20);
        line-height: 120%;
    }

    .nor_c{
        padding: calc(2vw + 70px) 5%;
        text-align: center;
    }
    .nor_c > h4{
        font-size: var(--f30);
        color: var(--colorgreenlight);
        line-height: 120%;
        letter-spacing: 0.1em;
        margin: 30px 0 0;
    }
    .nor_c > p{
        max-width: 840px;
        margin: 20px auto 0;
        font-size: var(--f17);
        line-height: 140%;
    }
    /*----------------------------------------*/

    /*露營約定*/
    .nop_a{
        padding: 70px 0;
        width: clamp(0px, 90%, 1600px);
        margin: auto;
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        position: relative;
        z-index: 1;
    }
    .nop_a section{
        width: 640px;
        margin: 0 30px 0 0;
    }
    .nop_a section h4{
        font-weight: normal;
        font-size: var(--f120);
        color: var(--colorpurple);
        line-height: 120%;
    }
    .nop_a section h5{
        font-size: var(--f30);
        line-height: 120%;
        letter-spacing: 0.1em;
        font-weight: normal;
        margin: 15px 0 0;
    }
    .nop_a section span{
        display: block;
        font-size: var(--f17);
        color: var(--colorpurple);
        line-height: 140%;
        margin: 15px 0 50px;
    }
    .nop_a section h6{
        font-size: var(--f20);
        color: var(--colorgreenlight);
        line-height: 120%;
        font-weight: 600;
        border-left: 4px solid var(--colorgreenlight);
        padding: 0 0 0 10px;
        margin: 40px 0 10px;
        max-width: 480px;
    }
    .nop_a section h6 s{
        display: inline-block;
        font-size: var(--f20);
        color: var(--colorgreenlight);
        line-height: 120%;
    }
    .nop_a section > p{
        font-size: var(--f17);
        line-height: 160%;
        max-width: 480px;
    }

    .nop_b{
        padding: calc(1vw + 70px) 0;
        width: clamp(0px, 90%, 1600px);
        margin: 0 auto 0;
        border-radius: clamp(15px, 10vw, 50px);
        background-color: #fff;
        padding: 50px 5%;
    }
    .nop_b ul{
        max-width: 1490px;
        margin: auto;
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 5%;
    }
    .nop_b ul li p{
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        padding: 10px 0;
        border-bottom: 1px solid var(--colorgreenlight);
    } 
    .nop_b ul li p s{
        min-width: 30px;
        height: 30px;
        background-color: var(--colorgreenlight);
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 15px 0 0;
        font-size: var(--f20);
        color: #fff;
    }
    .nop_b ul li p span{
        display: block;
        font-size: var(--f17);
    }
    .nop_b ul li p:nth-last-of-type(1){
        border: unset;
    }
    /*----------------------------------------*/

    /*聯絡我們*/
    .noc_a{
        padding: calc(1vw + 70px) 5%;
    }
    .noc_a01{
        max-width: 1200px;
        margin: auto;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        position: relative;
        z-index: 1;
    }
    .noc_a01 > i{
        display: block;
        min-width: fit-content;
        margin: 0 30px 0 0;
    }
    .noc_a01 section b{
        display: block;
        font-size: var(--f17);
        color: var(--colorgreenlight);
        line-height: 160%;
        letter-spacing: 0.1em;
    }
    .noc_a01 section p{
        font-size: var(--f15);
        line-height: 160%;
    }
    .noc_a02{
        max-width: 1200px;
        margin: 70px auto 0;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .noc_a02_left{
        width: 535px;
        margin: 0 5% 0 0;
    }
    .noc_a02_left dl{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin: 0 0 15px;
    }
    .noc_a02_left dl dt{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        min-width: 130px;
        margin: 0 20px 0 0;
    }
    .noc_a02_left dl dt i{
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 500px;
        background-color: var(--colorgreenlight);
        margin: 0 15px 0 0;
        min-width: 40px;
        height: 40px;
    }
    .noc_a02_left dl dt s{
        font-size: var(--f17);
        line-height: 200%;
        color: #000;
    }
    .noc_a02_left dl dd a{
        font-size: var(--f17);
        line-height: 200%;
        color: #000;
    }
    .noc_a02_left dl dd a:hover{
        color: var(--colorgreen);
    }
    .noc_a02_left section{
        margin: 50px 0 0;
    }
    .noc_a02_left section a{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        padding: 5px 15px;
        border: 1px solid;
        max-width: 365px;
        margin: 10px 0 0;
    }
    .noc_a02_left section a ul{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        min-width: 130px;
    }
    .noc_a02_left section a ul ol{
        min-width: fit-content;
        margin: 0 10px 0 0;
    }
    .noc_a02_left section a ul li{
        font-size: var(--f17);
        line-height: 200%;
    }
    .noc_a02_left section a span{
        display: block;
        padding: 0 0 0 15px;
        margin: 0 0 0 15px;
        border-left: 1px solid;
        font-size: var(--f17);
        color: #000;
    }
    .noc_a02_left section a.no_btn_line{
        border-color: var(--colorgreen);
    }
    .noc_a02_left section a.no_btn_line li{
        color: var(--colorgreen);
    }
    .noc_a02_left section a.no_btn_line span{
        border-color: var(--colorgreen);
    }
    .noc_a02_left section a.no_btn_fb{
        border-color: #00468C;
    } 
    .noc_a02_left section a.no_btn_fb li{
        color: #00468C;
    }
    .noc_a02_left section a.no_btn_fb span{
        border-color: #00468C;
    }
    .noc_a02_left section a.no_btn_map{
        border-color: #D83E20;
    } 
    .noc_a02_left section a.no_btn_map li{
        color: #D83E20;
    }
    .noc_a02_left section a.no_btn_map span{
        border-color: #D83E20;
    }
    .noc_a02_left section a.no_btn_line:hover{
        background-color: var(--colorgreen);
    }
    .noc_a02_left section a:hover *{
        filter: grayscale(100) brightness(100);
        -webkit-filter: grayscale(100) brightness(100);
    }
    .noc_a02_left section a:hover span{
        color: #fff;
    }
    .noc_a02_left section a.no_btn_fb:hover{
        background-color: #00468C;
    }
    .noc_a02_left section a.no_btn_map:hover{
        background-color: #D83E20;
    }
    .noc_a02_right{
        display: block;
        align-self: stretch;
        width: 610px;
    }
    /*----------------------------------------*/

    @media (max-width: 1600px) {
        .hs_box{
            --f120:100px;
            --f80:70px;
            --f60:50px;
        }

        /*首頁*/
        .noi_c01 section{margin: 0 20px 60px 0;}
        .noi_c01_owl{max-width: 800px;}
        /*----------------------------------------*/

        /*營區守則*/
        /*----------------------------------------*/
    }
    @media (max-width: 1360px) {
        .hs_box{
            --f120:80px;
            --f80:60px;
            --f60:40px;
            --f30:25px;
            --f25:22px;
            --f23:20px;
        }

        /*首頁*/
        .noi_c01{margin: 15px 0 0;}
        .noi_c01_owl{max-width: 650px;}
        /*----------------------------------------*/

        /*營區守則*/
        .nor_a section{margin: unset;}
        .nor_a > i{position: absolute;top: 8vw;right: -20vw;z-index: -1;width: clamp(200px, 65vw, 970px);}
        .nor_b01 > dl dt{width: 350px;}
        /*----------------------------------------*/

        /*露營約定*/
        .nop_a section{margin: unset;}
        .nop_a > i{position: absolute;top: 8vw;right: -20vw;z-index: -1;width: clamp(250px, 55vw, 970px);}
        /*----------------------------------------*/

        /*聯絡我們*/
        /*----------------------------------------*/
    }
    @media (max-width: 1024px) {

        /*首頁*/
        .noi_c{padding: 70px 5%;}
        .noi_c01{flex-direction: column;align-items: center;}
        .noi_c01 section{margin: 0 0 30px;width: unset;}
        .noi_c01_owl{max-width: unset;}
        .owl-theme .owl-nav{justify-content: center;}
        .noi_c01_owl .item{padding: 5px;}
        .noi_c03 figure{margin: 30px 0 0;transform: unset;}
        /*----------------------------------------*/

        /*營區守則*/
        /*----------------------------------------*/

        /*露營約定*/
        /*----------------------------------------*/

        /*聯絡我們*/
        /*----------------------------------------*/
    }
    @media (max-width: 968px) {
        .hs_box{
            --f120:60px;
            --f80:40px;
            --f60:30px;
            --f30:22px;
            --f25:20px;
            --f23:18px;
            --f20:18px;
            --f17:16px;
        }

        /*首頁*/
        .noi_a01{flex-direction: column;align-items: center;}
        .noi_a01 section{margin: 0 0 40px;}
        .noi_a01 ul li:nth-of-type(3){padding: 0 0 0 5px;}
        .noi_a02 > i img{width: 80px;}
        .owl-carousel .owl-item img{height: unset;}
        .noi_c02 > a{width: 70px;height: 70px;}
        .noi_c03 figure{flex-direction: column-reverse;align-items: center;}
        .noi_c03 figure i{padding: 30px 0 0;text-align: center;}
        /*----------------------------------------*/

        /*營區守則*/
        .nor_b01 > section{justify-content: center;}
        .nor_b01 > dl{flex-direction: column;}
        .nor_b_con01,
        .nor_b_con02,
        .nor_b_con03{margin: 30px auto 0;max-width: fit-content;}
        /*----------------------------------------*/

        /*露營約定*/
        .nop_b ul{grid-template-columns: 1fr;}
        /*----------------------------------------*/

        /*聯絡我們*/
        /*----------------------------------------*/
    }
    @media (max-width: 768px) {
        /*首頁*/
        .noi_a02{justify-content: center;}
        .noi_a02 dl{width: 400px;}
        .noi_a02 dl dd{flex-direction: column;align-items: flex-start;}
        .noi_a02 dl dd section{margin: 15px 0 0;border: unset;padding: unset;}
        .noi_b01{padding: 0px;text-align: center;}
        .noi_b01 > i{margin: 30px auto;}
        .noi_b01 > a{position: relative;bottom: unset;right: unset;margin: 30px auto 0;}
        .noi_b::after{left: 50%;transform: translateX(-50%);top: calc(100% - 1px);}
        .noi_c01 section{text-align: center;}
        .owl-carousel .owl-nav button{width: 40px;height: 40px;}
        .noi_c03 section h4{margin:auto;}
        /*----------------------------------------*/

        /*營區守則*/
        .nor_b_con03 ul ol,.nor_b_con03 ul li{padding: 15px;}
        /*----------------------------------------*/

        /*露營約定*/
        .nop_a{padding: 70px 0 clamp(180px, 40vw, 350px);}
        .nop_a > i{top: unset;bottom: 0px;}
        /*----------------------------------------*/

        /*聯絡我們*/
        .noc_a02{flex-direction: column;}
        .noc_a02_right {align-self: center;}
        .noc_a02_right iframe{height: 350px;}
        .noc_a02_left{margin: 0 0 30px;width: fit-content;}
        /*----------------------------------------*/
    }
    @media (max-width: 568px) {
        .hs_box{
            --f120:40px;
            --f80:30px;
            --f60:25px;
            --f30:20px;
            --f25:18px;
            --f23:16px;
            --f20:16px;
            --f17:15px;
            --f15:14px;
        }

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

        /*營區守則*/
        .nor_a{padding: 120px 0 70px;}
        .nor_a > i{top: -5vw;}
        .nor_b01 > section{flex-direction: column;}
        .nor_b01 > section i{min-width: 100px;width: 100px;margin: 0 0 10px;}
        .nor_b01 > section i::before{top: calc(50% + 2px);}
        .nor_b_con01 p{flex-direction: column;}
        .nor_b_con01 p s{margin: 0 0 10px;width: 100%;}
        .nor_b_con01 p s br{display: none;}
        .nor_b01 > dl dt{width: 100%;}
        .nor_b_con02 > ul li s{min-width: 20px;height: 20px;margin: 5px 10px 0 0;}
        .nor_b_con02 > b{max-width: 100%;}
        /*----------------------------------------*/

        /*露營約定*/
        .nor_b_con03 ul .nor_30{width: 45%;}
        .nor_b_con03 ul .nor_70{width: 55%;}
        .nor_b_con03 ul ol,.nor_b_con03 ul li{padding: 10px 5px;}
        /*----------------------------------------*/

        /*聯絡我們*/
        .noc_a01 > i{margin: 0px;position: absolute;top: -70px;left: 0px;width: 120px;}
        .noc_a01 > i img{width: 120px;}
        .noc_a02{margin: 30px auto 0;}
        /*----------------------------------------*/
    }
    @media (max-width: 425px) {
        /*首頁*/
        .noi_a01 ul{flex-wrap: wrap;justify-content: center;}
        .noi_a01 ul li{width: calc(100%/2);}
        .noi_a01 ul li:nth-of-type(3){padding: 0px;margin: -10vw 0 0 0;}
        .noi_a02{flex-direction: column;align-items: center;}
        .noi_a02 > i{margin: 0 0 10px;}
        .noi_a02 dl{text-align: center;}
        .noi_a02 dl dd section{justify-content: center;margin: 15px auto 0;}
        .owl-carousel .owl-nav button{width: 30px;height: 30px;}
        .owl-carousel .owl-nav button:before{width: 10px;height: 24px;}
        /*----------------------------------------*/

        /*營區守則*/
        .nor_a section dl{flex-direction: column;}
        .nor_a section dl dt{margin: 0 0 5px;}
        /*----------------------------------------*/

        /*露營約定*/
        /*----------------------------------------*/

        /*聯絡我們*/
        .noc_a02_left dl dt i{min-width: 25px;height: 25px;margin: 0 5px 0 0;}
        .noc_a02_left dl dt i img{width: 50%;}
        .noc_a02_left dl dt{margin: 0 5px 0 0;min-width: 90px;}
        /*----------------------------------------*/
    }
    @media (max-width: 375px) {
        /*首頁*/
        /*----------------------------------------*/

        /*營區守則*/
        /*----------------------------------------*/

        /*露營約定*/
        /*----------------------------------------*/

        /*聯絡我們*/
        .noc_a02_left section a{flex-direction: column;align-items: center;max-width: fit-content;}
        .noc_a02_left section a span{margin: 10px 0 0;border: unset;padding: unset;}
        /*----------------------------------------*/
    }