@charset "utf-8";

/*Header/＝＝＝＝＝*/
.main_header_area {
    background: #fff;
}

.pageIndex .header_area {
    position: fixed;
    width: 100%;
    text-align: center;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    margin-top: 25px;
    flex-wrap: wrap;
}

.pageIndex .main_header_area {
    background: rgb(255 255 255 / 30%);
    backdrop-filter: blur(15px);
    width: 90%;
    transition: 0.8s;
    border-bottom: none;
}

.main_header_area {
    background: #26495b;
    border-bottom: 1px solid #ffffff3d;
}

.main_header_area .container {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}

.pageIndex .navigation {
    position: relative;
    padding: 10px 0 10px 210px;
}

.navigation {
    padding: 15px 0 15px 210px;
}

/*第一層*/
.stellarnav>ul>li>a {
    color: #ffffff;
    font-size: 15px;
    line-height: 35px;
    height: 35px;
    letter-spacing: 2px;
    width: 150px;
    margin: 0px;
    padding: 0px;
}

.pageIndex .stellarnav>ul>li:hover>a {
    color: #26495b;
}

.stellarnav>ul>li:hover>a,
header.header_area.sticky .stellarnav>ul>li:hover>a {
    color: #ffffff;
}

/*第二層*/
li.has-sub {
    overflow: hidden;
}

.stellarnav li.has-sub>a:after,
.me_tp_features {
    display: none;
}

.stellarnav li li>a,
.stellarnav li li.has-sub>a {
    padding: 7px 5px;
    transition: all 0.3s;
    border-left: 1px solid transparent;
}

.stellarnav li li:hover>a,
.stellarnav li li.has-sub:hover>a {
    color: #ADA17E;
    padding-left: 10px;
    border-color: #ADA17E;
}


/*下滑*/
.header_area.sticky {
    margin-top: 0;
}

header.header_area.sticky .main_header_area {
    background: #26495b;
    width: 100%;
    transition: 0.8s;
}

/*Footer/＝＝＝＝＝*/
.footer {
    background: #26495b;
}

.footer_menu a {
    padding: 2px 20px 2px 10px;
    border: none;
    color: #a6b3b9;
    background: transparent;
    border-right: 1px solid;
    transition: 0.5s;
    margin: 0px;
}

.footer_info li:nth-child(2) {
    border-top: 1px solid #597a8e;
}

.footer_info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.footer_info li p,
.footer_info li p>a {
    color: #fff;
}

.footer_menu a:hover {
    background: transparent;
    color: #d5dce0;
    letter-spacing: 2px;
}

.copy,
.copy a,
.copy a:hover {
    color: #a6b3b9;
    transition: all 0.3s;
}

.copy {
    border-top: none;
    margin-top: 0px;
}

.box_link a {
    border: 1px solid;
    filter: contrast(0) brightness(100);
    border-radius: 99em;
    width: 45px;
    height: 45px;
    margin-bottom: 8px;
    position: relative;
    right: 60px;
}

.box_link a.me_tp_mail {
    display: none;
}

.box_link>a:hover {
    background: #3e7592;
    color: #fff;
    filter: none;
}

/*Logo/＝＝＝＝＝*/
.nav-brand {
    width: 100%;
    max-width: 145px;
    padding: 8px;
    transition: all 0.3s;
}

.footer_logo img {
    width: 200px;
}

.header_area.sticky .nav-brand {}

/*按鈕/＝＝＝＝＝*/
.animated-arrow {
    background: #ADA17E;
}

/*大圖/＝＝＝＝＝*/
/*預設解除背景輪播*/
#content_main {
    margin: 0;
}

.swiper-banner {
    position: static;
    margin: 0;
    height: auto;
}

.bannerindex {
    padding: 0;
    margin: 0;
    height: 100vh;
    position: relative
}

.swiper-slide img {
    width: 100%;
    display: block;
    max-width: 100%;
    min-width: 100%;
    height: 100vh;
    object-position: center;
    object-fit: cover;
    -moz-object-fit: cover;
    -ms-object-fit: cover;
    -o-object-fit: cover;
    -webkit-object-fit: cover;
    margin: 0;
    transition: all 0.3s;
}

@media screen and (max-width: 768px) {
    .bannerindex {
        padding: 0;
        margin: 0;
        height: 65vh;
    }

    .swiper-slide img {
        height: 65vh;
    }
}

/*Banner/＝＝＝＝＝*/
.banner,
.path {
    display: none;
}

/*頁碼＝＝*/
.page {
    width: 100%;
    margin: 40px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.page li {
    display: flex;
    margin: 3px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    align-items: center;
    justify-content: center;
}

.page li a {
    display: block;
    width: inherit;
    height: inherit;
    line-height: inherit;
    padding: 0;
    transition: all 0.3s;
}

.page strong,
.page a:hover {
    background: #ADA17E;
    border: 1px solid #ADA17E;
}

/*編輯頁*/
.other_select_page .promotion_title,
.other_select_page .other_promotion,
.other_select_page .page {
    display: none !important;
}

@media screen and (max-width: 1200px) {

    /*購物車/＝＝＝＝＝*/
    .products-list {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media screen and (max-width: 1100px) {
    .pageIndex .header_area {
        position: sticky;
        background: #26495b;
        margin-top: 0px;
    }

    .pageIndex .main_header_area {
        width: 100%;
        background: transparent;
    }

}

@media screen and (max-width: 1024px) {

    /*Header/＝＝＝＝＝*/
    .nav-header {
        position: absolute;
        text-align: left;
    }

    .stellarnav>ul>li>a {
        width: 110px;
    }

    .stellarnav>ul>li>a {
        letter-spacing: 0px;
    }

    .pageIndex .stellarnav>ul>li:hover>a {
        color: #fff;
    }

    .stellarnav ul {
        text-align: right;
    }

    .navigation {
        padding: 10px;
    }

    /*文章管理/＝＝＝＝＝*/
    .module_i_news ul {
        grid-template-columns: 1fr 1fr;
    }

    /*購物車/＝＝＝＝＝*/
    .product_page .products-list {
        grid-template-columns: 1fr 1fr;
    }

}

/*RWD980/＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width: 980px) {

    /*footer*/
    .footer_info {
        flex-direction: column;
    }

    .footer_info li:nth-child(1) {
        width: fit-content;
        margin: 0 auto;
    }

    .footer_menu a:nth-child(1) {
        border-left: 1px solid;
        padding: 2px 15px;
    }

    .box_link {
        display: block;
        width: 100%;
        position: static;
        padding-top: 10px;
    }

    .box_link a {
        position: initial;
    }

    .footer_info li:nth-child(2) {
        text-align: center;
    }
}

/*RWD768/＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width: 768px) {

    /*側邊選單/＝＝＝＝＝*/
    .stellarnav li li>a,
    .stellarnav li li.has-sub>a {
        padding: 10px;
        border-left: none;
    }

    .stellarnav li li:hover>a,
    .stellarnav li li.has-sub:hover>a {
        padding: 10px;
        border-color: transparent;
    }

    /*Logo/＝＝＝＝＝*/
    .nav-brand {
        margin-top: 10px;
    }

    .header_area .nav-brand {
        max-width: 150px;
        margin: 0 auto;
    }

    /*header*/
    .nav-header {
        position: initial;
        text-align: center;
    }

    .pageIndex .navigation {
        padding: 0px;
    }

    .stellarnav .menu-toggle span.bars span {
        background: #fff;
    }

    .stellarnav .menu-toggle:after {
        color: #fff;
    }

    .stellarnav.mobile ul {
        background: #26495b;
    }

    .pageIndex .main_header_area {
        backdrop-filter: initial;
    }

    .stellarnav.mobile>ul>li>a {
        padding: 15px 10px;
        width: 100%;
    }

    .stellarnav a.dd-toggle .icon-plus:before,
    .stellarnav a.dd-toggle .icon-plus:after {
        display: none;
    }

    .stellarnav.mobile ul ul {
        height: 0;
    }

    .stellarnav.mobile li.open {
        background: #26495b;
        padding: 0px;
    }

    .stellarnav.mobile li a {
        border-bottom: none;
    }

    .stellarnav.mobile>ul>li>a.dd-toggle {
        padding: 0px;
    }

    /*Footer/＝＝＝＝＝*/
    #to_top {
        bottom: 60px;
    }

    .footer.with_shopping_mode {
        padding: 30px 0;
    }

    .footer_info {
        justify-content: center;
    }

    .footer_logo {
        text-align: center;
    }

    /*Banner/＝＝＝＝＝*/
    .banner h5 {
        font-size: 28px;
    }




}

/*RWD600/＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width: 600px) {

    /*Footer/＝＝＝＝＝*/
    .box_link {
        text-align: center;
    }

    .footer_menu {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

    .footer_menu a {
        border: 1px solid;
        padding: 5px 10px;
        margin: 5px;
    }

    .footer_menu a:nth-child(1) {
        padding: 5px 15px;
    }

    /*Banner/＝＝＝＝＝*/
    .banner h5 {
        font-size: 24px;
    }

    /*購物車/＝＝＝＝＝*/
    .prod_related h6 span:before {
        font-size: 20px;
    }

    /*文章管理/＝＝＝＝＝*/
    .module_i_news ul,
    .blog_subbox {
        grid-template-columns: 1fr;
    }

    .i_blog_le,
    .blog_list_le {
        padding-bottom: 75%;
    }

    h4.blog_category_title {
        font-size: 20px;
    }

    h4.blog_category_title span {
        font-size: 18px;
    }

    /*相簿/＝＝＝＝＝*/
    ul.show-list,
    .other_subalbum,
    ul.pic-list {
        display: grid;
        grid-template-columns: 1fr;
    }

    .mobile_product_name {
        font-size: 18px;
    }

    .subalbum-menu h2 {
        font-size: 18px;
    }

    /*促銷方案/＝＝＝＝＝*/
    .news_list ul li p:after {
        width: fit-content;
        margin: 10px auto 0;
    }
}

/*RWD375/＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width: 375px) {

    /*購物車/＝＝＝＝＝*/
    .products-list,
    .product_page .products-list {
        grid-template-columns: 1fr;
    }
}

/* 文章管理 */
body.blog_page .main_part {
    max-width: 1600px;
}


body.blog_in_page .blog_box_edit p {
    line-height: 2;
    color: #444;
    font-weight: 400;
}

body.blog_in_page .blog_box_edit p+p {
    margin-top: 20px;
}

body.blog_in_page .blog_box_edit h5 {
    color: #192821;
    font-weight: bold;
    border: 1px solid;
    padding: 5px 15px;
    border-radius: 3px;
    font-size: 18px;
    display: inline-block;
}

body.blog_in_page .blog_box_edit h6 {
    color: #a78a6b;
    font-weight: 600;
}

body.blog_in_page .blog_box_edit a {
    color: #a78a6b;
    border-bottom: 1px solid;
    font-weight: 500;

}

body.blog_in_page .blog_box_edit p+li {
    margin-top: 20px;
}

body.blog_in_page .blog_box_edit li+li {
    margin-top: 20px;
}

body.blog_in_page .blog_box_edit>li {
    color: #444;
    line-height: 1.8;
    margin-left: 17px;
}


@media screen and (max-width: 476px) {

    body.blog_in_page .blog_box_edit p,
    body.blog_in_page .blog_box_edit a {}

    body.blog_in_page .blog_box_edit h5,
    body.blog_in_page .blog_box_edit h6 {}

}

h5.blog_le_t,
h4.blog_category_title {
    font-size: 22px;
    margin-bottom: 0;
}

.blog_le .accordion>li:hover .link {
    background: #a5a5a5;
}

.blog_le .accordion>li.on_this_category .link {
    background: #999999;
}

.subbox_item a:before {
    display: none;
}

.blog_list_ri:after {
    content: 'READ MORE >';
    display: block;
    background: transparent;
    color: #000;
    letter-spacing: 1px;
    opacity: 1;
    left: 0;
    position: relative;
    padding: 0 22px 0 0;
    font-size: 12px;
    line-height: 12px;
}

.blog_list_ri em {
    display: none;
}

.blog_list_ri p {
    padding-top: 8px;
}

.blog_back a.article_btn_back {
    background: #26495b;
    transition: all 0.3s ease-in-out;

}

.blog_back a.article_btn_prev,
.blog_back a.article_btn_next {
    background: #f5f5f5;
    color: #000;
    transition: all 0.3s ease-in-out;
}

.blog_back a.article_btn_prev:hover,
.blog_back a.article_btn_next:hover,
.blog_back a.article_btn_back {
    filter: brightness(1.05);
    transition: all 0.3s ease-in-out;

}

.blog_search input[type=search] {
    border-radius: 2px;
}

.blog_le .accordion {
    border-radius: 2px;
}


.blog_subbox.clearfix {
    margin: 0 auto;
    display: grid;
    grid-gap: 30px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

body.blog_page .clearfix:before,
body.blog_page .clearfix:after {
    display: none;
}

.subbox_item {
    background-color: transparent;
    overflow: hidden;
    position: relative;
    width: 100%;
    border-bottom: none;

}

.subbox_item a {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.subbox_item:hover img {
    transform: translate(-50%, -50%) scale(1.05);
    object-fit: cover;
    width: 100%;
    transition: all 0.4s ease;

}

.blog_list_le img {
    display: block;
    max-width: 100%;
    min-width: 100%;
    object-fit: cover;
    position: absolute;
    left: 50%;
    top: 50%;
    transition: all 5000ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
    transform: translate(-50%, -50%) scale(1);
}

.blog_list_le {
    display: block;
    position: relative;
    text-align: center;
    height: auto;
    aspect-ratio: 9 / 9;
    overflow: hidden;
    padding-bottom: 0;
    width: 100%;
}

.subbox_item a:after {
    display: none;
}

.blog_list_ri {
    width: 100%;
}

.blog_list_ri em {
    width: 100%;
    color: #7fcbcf;
}

.blog_list_ri h5 {
    position: relative;
    margin: 15px 0 0;
    font-size: 18px;
    letter-spacing: 0.035em;
}

.blog_list_ri p {
    color: #595959;
    margin: 15px 0 0;
    font-size: 14px;
    line-height: 1.9;
    letter-spacing: 0.035em;
    width: 100%;
    padding: 0;
    margin: 10px 0;
}

.blog_list_ri p:after {
    content: '...';
}

.subbox_item:hover:before {
    width: 100%;
    transition: all .5s;
}

@media screen and (max-width: 1200px) {
    .blog_subbox.clearfix {
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width: 600px) {
    .blog_subbox.clearfix {
        grid-template-columns: 1fr;
    }
}

@media screen and (max-width: 768px) {
    .blog_le.fadeInLeft.animated15.clearfix {
        position: relative;
        top: auto;
    }

    .blog_box {
        padding-bottom: 80px;
    }
}

@media screen and (max-width: 476px) {
    .blog_subbox.clearfix {
        grid-template-columns: 1fr;
    }
}


.footer_info li p.add2:before {
    content: '民宿登記證：';
}

.footer_info li:nth-child(1){display: grid;}
.footer_info li p:nth-child(5) {
    order: 1;}

.footer_info li p:nth-child(1) {
    order: 2;}

.footer_info li p:nth-child(2) {
    order: 3;}

.footer_info li p:nth-child(3) {
    order: 4;}

.footer_info li p:nth-child(4) {
    order: 5;}