@charset "utf-8";


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*預設解除背景輪播*/
#content_main { margin:0;}
.swiper-banner { position:static; margin:0; height:auto;} 
.path {display: none;}
/* .swiper-slide img { height:auto;} */
@media screen and (max-width: 768px) {
.bannerindex { padding:0; height: auto;}
}

/*網站統一設定*/
.main_part {max-width: 1600px;padding: 100px 0;width: 90%;}
.show_content {padding: 0;}
.page {margin: 50px auto;color: #000;gap: 5px;}
.page li {margin: 0;display: flex;width: 30px;height: 30px;line-height: 30px;
justify-content: center;align-items: center;align-content: center;text-align: center;border-radius: 50px;transition: .3s;}
li.pre_page , .page li.next_page {width: 80px;}
li.pre_page a , .page li.next_page a {padding: 5px 15px;font-size: 13px;}
.page li a, .page li strong {width: 30px;height: 30px;line-height: 30px;color: #000;}
.page li strong {color: #fff;}
.page strong, .page a:hover {background: #000;color: #ffffff;}
.page li.activeN {background: #000;color: #ffffff;}

@media screen and (max-width: 1024px) {
.main_part {padding: 80px 0;}
.page {font-size: 15px;gap: 3px;}
}
@media screen and (max-width: 500px) {
.main_part {padding: 60px 0;}
.page {font-size: 14px;gap: 2px;}
}
@media screen and (max-width: 425px) {
.main_part {padding: 50px 0;}
.page {font-size: 13px;gap: 0;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*HEADER*/
.pageIndex .header_area {position: fixed;padding: 0;background: linear-gradient(180deg, black, transparent);transition: 0.3s all;}
.header_area {position: sticky;padding: 0;background: #181C33;transition: 0.3s all;}
.header_area.sticky { background: #181C33;transition: 0.3s all;}
.main_header_area .container {max-width: 1600px;width: 90%;}
.navigation {grid-template-columns: 130px 1fr;grid-gap: 0 50px;align-items: center;transition: 0.3s all;}
.header_area.sticky .navigation {grid-template-columns: 80px 1fr;transition: 0.3s all;}
.me_tp_features {display: none;}

/*LOGO*/
.nav-header {grid-row: 1 / 1;filter: invert(1);padding: 15px 0;max-width: 130px;}
.nav-brand {display: flex;}

/*選單*/
.stellarnav > ul > li > a {display: block;padding: 25px 15px;letter-spacing: 0.05em;color: #fff;position: relative;
    line-height: 1;height: auto;margin: 0;transition: 0.3s all;}
.stellarnav > ul > li.has-sub > a {padding-right: 15px;}
.stellarnav li.has-sub > a:after {display: none;}
.header_area.sticky .stellarnav > ul > li > a {padding: 38px 15px;transition: 0.3s all;}
.stellarnav > ul > li > a:hover {color: #BF9649;transition: 0.3s all;}


/*下拉選單*/
.stellarnav > ul > li > ul{transform: translateX(-50%);left: 50%;background: #181c33e6;}
.stellarnav > ul > li > ul > li > ul {}
.stellarnav > ul > li > ul > li, .stellarnav > ul > li > ul > li > ul > li {border: none;}
.stellarnav > ul > li > ul > li+li, .stellarnav > ul > li > ul > li > ul > li+li {border-top: 1px solid #ffffff3d;}
.stellarnav > ul > li > ul > li > a, .stellarnav > ul > li > ul > li > ul > li > a {color: #fff;letter-spacing: 0.05em;
    font-size: 14px;text-align: center;padding: 15px 5px;transition: 0.3s all;}
.stellarnav > ul > li > ul > li > a:hover, .stellarnav > ul > li > ul > li > ul > li > a:hover {
    background: #181C33;color: #BF9649;transition: 0.3s all;}


@media screen and (max-width: 1080px) {
.main_header_area .container {max-width: 90%;}
.navigation {grid-template-columns: 100px 1fr;}
}
@media screen and (max-width: 1024px) {
.pageIndex .header_area {position: sticky;top: 0;background: #181C33;transition: 0.3s all;}
.header_area.sticky {top: -100px;transition: 0.3s all;}
.nav-header {max-width: 90px;transition: 0.3s all;}
.header_area.sticky .stellarnav > ul > li > a, .stellarnav > ul > li > a {padding: 25px 10px;font-size: 15px;transition: 0.3s all;}
.stellarnav > ul > li.has-sub > a {padding-right: 10px;transition: 0.3s all;}
}
@media screen and (max-width: 768px) {
.nav-header {max-width: 70px;}
.header_area.sticky {padding: 10px 0;top: 0px;transition: 0.3s all;}
.bodyMobile.headerSticky .nav-header {width: 0;transition: 0.3s all;}
.main_header_area .container {max-width: 95%;}
.stellarnav.mobile {height: 100%;display: inline-flex;justify-content: center;align-items: center;}
.stellarnav.mobile .menu-toggle {display: flex;align-items: center;gap: 10px;padding: 0 0 0 20px;}
.stellarnav .menu-toggle span.bars {top: 0;}
.stellarnav .menu-toggle span.bars span {width: 25px;border-radius: 0;background: #fff;margin: 5px auto 5px;}
.stellarnav .menu-toggle span.bars span:nth-of-type(2) {width: 20px;margin-left: 0;}
.stellarnav .menu-toggle span.bars span:nth-of-type(3) {width: 15px;margin-left: 0;}
.stellarnav .menu-toggle:after {font-size: 12px;color: #fff;letter-spacing: 0.15em;transform: unset;}

.stellarnav.mobile.left > ul {border: none;background: linear-gradient(180deg, #181d34, #181d34f2);max-width: 80%;padding: 5% 0;}
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu {padding: 0 30px 30px;font-size:0;background: unset;}
.stellarnav .icon-close {width: 50px;height: 50px;display: inline-flex;justify-content: center;align-items: center;
    border: 1px solid #fff;border-radius: 100%;}
.stellarnav .icon-close:before, .stellarnav .icon-close:after {width: 20px;border-bottom: solid 1px #fff;}
.stellarnav.mobile li.open ul {background: #181C33;}
.stellarnav.mobile > ul > li {border-bottom: none;}
.stellarnav.mobile > ul > li+li {border-top: 1px solid #3e4467;}
.stellarnav.mobile > ul > li > a {padding: 30px 0;text-align: center;line-height: 1;}
.stellarnav.mobile li a {border-bottom: none;}
.stellarnav.mobile > ul > li.has-sub > a {padding-right: 0;}
.stellarnav.mobile > ul > li > a.dd-toggle {width: 75px;padding: 30px 10px;}
.stellarnav a.dd-toggle .icon-plus:before, .stellarnav a.dd-toggle .icon-plus:after {width: 15px;border-bottom: solid 1px #fff;}
.stellarnav.mobile li.open, .stellarnav.mobile li.open li.open {background: #59392D;padding: 0;}
.stellarnav li.open > a.dd-toggle .icon-plus {-webkit-transform: unset;-ms-transform: unset;-o-transform: unset;transform: unset;}
.stellarnav li.open > a.dd-toggle .icon-plus:before {transform: rotate(0deg);}
}
@media screen and (max-width: 600px) {
.header_area.sticky {padding: 5px 0;}
.nav-header {max-width: 50px;}
.stellarnav .menu-toggle:after {font-size: 10px;}
.stellarnav .menu-toggle span.bars span {width: 20px;margin: 3px auto 3px 0;}
.stellarnav .menu-toggle span.bars span:nth-of-type(2) {width: 15px;}
.stellarnav .menu-toggle span.bars span:nth-of-type(3) {width: 10px;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*大圖*/
@-webkit-keyframes bannerop {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes bannerop {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

/*大圖*/
.banner_video {position: sticky;left: 0;top: 0;width: 100%;height: auto;}
.banner_video:before {content: '';position: absolute;
    background-image: url(https://pic03.eapple.com.tw/everyimagestu/BAW-03.svg);
    opacity: 1;width: 100%;top: 0;left: 0%;aspect-ratio: 64 / 36;
    background-size: contain;background-repeat: no-repeat;z-index: 999;}
.banner_video video {aspect-ratio: 1920 / 960;}

/*手機大圖*/
@media screen and (max-width: 1024px) {
.bannerindex {position: relative;height: auto;}
}


/*內頁BANNER 設定*/
.banner {position: relative;width: 90%;margin: auto;max-width: 1600px;padding: 0;background: unset;min-height: 25vh;
    align-content: end;justify-content: flex-start;}
.banner:after {content: '';position: absolute;width: 80%;top: auto;bottom: 0;left: auto;right: 0;
    background: #171932;height: 1px;}
.banner h5 {font-size: 28px;font-weight: normal;letter-spacing: 0.1em;text-align: left;}
.banner h5:before {content: '';display: block;font-size: 50px;font-weight: 600;letter-spacing: 0.05em;color: #BE9447;}
.services_page .banner h5:before {content: 'SERVICE';}
.blog_page.article_a .banner h5:before, .blog_in_page.article_a .banner h5:before {content: 'WORKS';}
.blog_page.article_b .banner h5:before, .blog_in_page.article_b .banner h5:before {content: 'BLOG';}
.banner.banB[data-banner="other_page_21301"] h5:before {content: 'AWARDS';}
.banner.banB[data-banner="other_page_21303"] h5:before {content: 'CONTACT';}
.banner.banA {}
.banner.banB {}
.banner.banC {}
.banner.banD {}
.banner.banE {}
.banner.banblog {}

@media screen and (max-width: 1200px) {
.banner:after {width: 75%;}
.banner h5:before {font-size: 45px;}
.banner h5 {font-size: 25px;}
}
@media screen and (max-width: 1024px) {
.banner h5:before {font-size: 40px;}
.banner h5 {font-size: 23px;}
}
@media screen and (max-width: 768px) {
.banner {margin-bottom: 5vh;}
.banner h5:before {font-size: 35px;}
.banner h5 {font-size: 22px;}
}
@media screen and (max-width: 600px) {
.banner {min-height: 15vh; margin-bottom: 0;}
.banner:after {width: 70%;}
.banner h5:before {font-size: 30px;}
.banner h5 {font-size: 20px;}
}
@media screen and (max-width: 450px) {
.banner:after {width: 65%;}
.banner h5:before {font-size: 26px;}
.banner h5 {font-size: 18px;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*FOOTER*/
.copy {padding: 20px 10% 50px;font-size: 12px;color: #2a2e4b;letter-spacing: 0.05em;border-top: none;
    margin-top: 0px;}
.copy a {color: #2a2e4b;}
.copy a:hover {color: #BF9649;}
.privacyLinks a+a {border-left: 1px solid #2a2e4b;}

#to_top {bottom: 50px;left: auto;right: 15px;padding-top: 17px;padding-right: 2px;font-size: 0;color: #fff;
    background: #BF9649;box-shadow: unset;border-radius: 0;transition: 0.3s all;}
#to_top:hover {border-radius: 50px;transition: 0.3s all;}
#to_top i.top:before, #to_top i.top:after {transform-origin: 50% 5%;width: 3px;background: #000;}
#to_top i:before {transform: rotate(-35deg);}
#to_top i:after {transform: rotate(35deg);}

@media screen and (max-width: 1024px) {}
@media screen and (max-width: 768px) {
#bottom_menu {display: none;}
#to_top {width: 40px;height: 40px;right: 10px;padding-top: 12px;}
}
@media screen and (max-width: 600px) {}
@media screen and (max-width: 450px) {
.copy {font-size: 10px;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*文章設定*/
.blog_page.article_a .blog_box {display: grid;grid-template-columns: 1fr;gap: 20px;}
.blog_page.article_a .blog_le {width: 100%;padding: 0;}
h5.blog_le_t, .blog_page.article_a .blog_search {display: none;}
.blog_page.article_a .blog_le .accordion {display: flex;justify-content: space-around;align-items: center;border-radius: 0;border: none;background: #F9F3EC;
    padding: 20px 5%;flex-wrap: wrap;transition: 0.3s all;}
.blog_page.article_a .accordion li+li .link {border-top: none;}
.accordion li .link a {padding: 5px 0;line-height: 1;color: #000;font-size: 16px;font-weight: normal;letter-spacing: 0.15em;
    transition: 0.3s all;}
.blog_le .accordion>li:hover, .blog_le .accordion>li.on_this_category {background: unset !important;}
.blog_le .accordion>li:hover .link a, .blog_le .accordion>li.on_this_category .link a {color: #BE9548 !important;transition: 0.3s all;}

.blog_page.article_a .blog_ri {width: 100%;padding: 0;}
.blog_page h4.blog_category_title {padding: 0;margin-bottom: 0;border-bottom: none;}
.blog_subbox {grid-template-columns: repeat(3, 1fr);grid-gap: 50px 20px;}
.subbox_item a {grid-template-columns: 1fr;grid-gap: 10px;}
.blog_list_le {aspect-ratio: 5 / 3;overflow: hidden;}
.blog_list_ri {padding: 0;}
.blog_list_ri h5 {font-weight: normal;font-size: 17px;letter-spacing: 0.05em;color: #000;-webkit-line-clamp: 2;transition: 0.3s all;}
.blog_list_ri>*+* {margin-top: 10px;}
.blog_list_ri em {display: none; font-size: 14px;color: #58382C;}
.subbox_item a:before, .subbox_item a:after {display: none;}
.blog_list_le img {transition: 0.3s all;}
.subbox_item a:hover .blog_list_le img {transform: scale(1.1);transition: 0.3s all;}
.subbox_item a:hover h5 {color: #BE9548;transition: 0.3s all;}

.blog_page.article_b .blog_box {gap: 0;}
.blog_page.article_b .blog_le, .blog_in_page.article_b .blog_le {display: none;}
.blog_page.article_b .blog_ri, .blog_in_page.article_b .blog_ri {width: 100%;padding: 0;}
.blog_page.article_b .blog_list_ri p {font-size: 13px;color: #aaa;letter-spacing: 0.05em;font-weight: 300;
    line-height: 1.5;-webkit-line-clamp: 2;}

@media screen and (max-width: 1200px) {
.blog_page.article_a .blog_le .accordion {flex-wrap: wrap;justify-content: flex-start;gap: 10px 0;}
.blog_page.article_a .accordion li {width: 25%;text-align: center;}
}

@media screen and (max-width: 1024px) {
.accordion li .link a {font-size: 15px;}
.blog_list_ri h5 {font-size: 16px;}
}
@media screen and (max-width: 960px) {
.blog_subbox {grid-template-columns: repeat(2, 1fr);}
.blog_page.article_a .accordion li {width: 33%;}
.subbox_item {border-bottom: none;}
}
@media screen and (max-width: 768px) {
.accordion li .link a {font-size: 14px;}
.blog_subbox {grid-gap: 30px 20px;}
.blog_list_ri h5 {-webkit-line-clamp: 3;font-size: 15px;}
}
@media screen and (max-width: 600px) {
.blog_le .accordion {flex-wrap: wrap;gap: 10px 0;}
.blog_le .accordion li {width: 50%;}
.blog_page.article_a .accordion li {width: 50%;}
.accordion li .link a {text-align: center;letter-spacing: 0.05em;}
.blog_subbox {grid-template-columns: 1fr;}
}
@media screen and (max-width: 450px) {
.accordion li .link a {font-size: 13px;}
}
@media screen and (max-width: 350px) {
.accordion li .link a {font-size: 12px;}
}

.blog_in_page .blog_ri {padding: 0 0 50px;border-bottom: 1px #58382c80 solid;}
h4.blog_category_title {color: #58382C;letter-spacing: 0.05em;font-weight: normal;font-size: 25px;border-bottom: 1px #58382c80 solid;
    padding: 0 0 20px;margin-bottom: 30px;}
.blog_shareData {display: none;}
.articel_mainPic {display: none;}
.blog_box_edit {letter-spacing: 0.05em;font-size: 16px;}
.blog_box_edit iframe {aspect-ratio: 5 / 3;margin-bottom: 50px;}
.news_tags a {color: #BE9548;}
.news_related {display: none;}


.blog_back {grid-gap: 10px; width: 50%;max-width: 350px;margin: auto;}
.blog_back a {color: #333;font-size: 16px;padding: 5px;letter-spacing: 0.15em;transition: 0.3s all;}
.blog_back a.article_btn_prev, .blog_back a.article_btn_back, .blog_back a.article_btn_next {background: unset;}
.blog_back a:hover {color: #BE9548;transition: 0.3s all;}

@media screen and (max-width: 1024px) {
h4.blog_category_title {font-size: 23px;margin-bottom: 10px;}
}
@media screen and (max-width: 768px) {
h4.blog_category_title {font-size: 22px;}
.blog_box_edit {font-size: 15px;}
.news_tags a {font-size: 14px;}
.blog_back a {font-size: 15px;}
}
@media screen and (max-width: 600px) {
h4.blog_category_title {font-size: 20px;}
.blog_box_edit {font-size: 14px;}
.news_tags a {font-size: 12px;}
.blog_back a {font-size: 14px;}
}
@media screen and (max-width: 450px) {
h4.blog_category_title {font-size: 18px;}
.blog_back {width: 100%;max-width: 100%;}
.blog_back a {font-size: 13px;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*聯絡資訊*/


@media screen and (max-width: 1024px) {}
@media screen and (max-width: 768px) {}
@media screen and (max-width: 600px) {}
@media screen and (max-width: 450px) {}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


