@charset "utf-8";


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*預設解除背景輪播*/
#content_main { margin:0;}
.bannerindex { position:relative; height:auto;}
.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; margin:0;}
}

/*網站統一設定*/
.main_part {max-width: 1500px;padding: 100px 5%;}
.show_content {padding: 0;}
.page {margin: 50px auto;color: #000000;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;}
.page li a, .page li strong {width: 30px;height: 30px;line-height: 30px;color: #000000;}
.page strong, .page a:hover {background: #000000;color: #ffffff;}
.page li.activeN {background: #000000;color: #ffffff;}

@media screen and (max-width: 1024px) {
.main_part {padding: 80px 5%;}
.page {font-size: 15px;gap: 3px;}
}
@media screen and (max-width: 500px) {
.main_part {padding: 60px 5%;}
.page {font-size: 14px;gap: 2px;}
}
@media screen and (max-width: 425px) {
.main_part {padding: 50px 5%;}
.page {font-size: 13px;gap: 0;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*HEADER*/
.header_area {background: #ffffff;padding: 0;}
.header_area.sticky {    background: #eeeeeec2;}
.header_area:before {content: '';position: absolute;left: 0;top: 0;width: 20%;height: 100%;
	background: #494949;clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);}
.main_header_area .container {max-width: 80%;}
.navigation {grid-template-columns: 100px 1fr 200px;grid-gap: 0 50px; align-items: center;}
.me_tp_features {order: 3;display: flex;align-items: center;justify-content: space-between;text-align: center;}
.me_tp_features a {margin: 0;font-size: 16px;line-height: 1;}
.me_tp_features a i {margin: 0 6px 0 0;}
.me_tp_features a span span {line-height: 1;}
.tp_links {display: none;}

/*LOGO*/
.nav-header {grid-row: 1 / 1;padding: 8px 0px;max-width: 90px;}
.nav-brand {display: flex;}

/*選單*/
.stellarnav {order: 2;}
.stellarnav ul {text-align: center;}
.stellarnav > ul > li > a {padding: 55px 10px;color: #494949;font-size: 17px;line-height: 1;height: auto;margin: 0;letter-spacing: 0.05em;transition: 0.3s ease;}
.stellarnav > ul > li:hover > a {color: #ccc;transition: 0.3s ease;}
.stellarnav > ul > li.has-sub > a {padding-right: 10px;}
.stellarnav li.has-sub > a:after {display: none;}

/*下拉選單*/
.stellarnav > ul > li > ul {}
.stellarnav > ul > li > ul > li {}
.stellarnav > ul > li > ul > li+li {}
.stellarnav > ul > li > ul > li > a {}
.stellarnav > ul > li > ul > li > a:hover {}
.stellarnav > ul > li > ul > li > ul {}
.stellarnav > ul > li > ul > li > ul > li {}
.stellarnav > ul > li > ul > li > ul > li+li {}
.stellarnav > ul > li > ul > li > ul > li > a {}
.stellarnav > ul > li > ul > li > ul > li > a:hover {}

@media screen and (max-width: 1510px) {
.main_header_area .container {max-width: 90%;}
.header_area:before {width: 15%;}
}
@media screen and (max-width: 1340px) {
.main_header_area .container {max-width: 95%;margin-right: 30px;}
.navigation {grid-template-columns: 85px 1fr 185px;grid-gap: 0 30px;}
.stellarnav > ul > li > a {font-size: 16px;padding: 55px 8px;}
.me_tp_features a {font-size: 15px;}
}
@media screen and (max-width: 1200px) {
.header_area:before {width: 20%;}
.navigation {grid-template-columns: 150px 1fr;align-items: end;grid-gap: 0 20px;}
.main_header_area .container {max-width: 90%;margin-right: auto;}
.nav-header {grid-row: 1 / span 2;max-width: 75px;}
.me_tp_features {order: 1;justify-content: flex-end;gap: 15px;padding-top: 10px;}
.stellarnav {order: 2;}
.stellarnav ul {text-align: right;}
.stellarnav > ul > li > a {padding: 10px 0px 20px 10px;}
}
@media screen and (max-width: 1024px) {
.header_area {background: #494949;}
.header_area.sticky {background: #4a4a4ae6;}
.header_area:before {display: none;}
.main_header_area .container {max-width: 95%;}
.navigation {align-items: center;grid-gap: 20px 0;}
.nav-header {padding: 15px 0px 0;}
.me_tp_features {justify-content: center;padding-top: 0;margin: 0;}
.me_tp_features a {color: #fff;}
.stellarnav ul {text-align: center;}
.stellarnav > ul > li > a {padding: 10px 7px 25px;color: #fff;}
}
@media screen and (max-width: 768px) {
.header_area {padding: 15px 0;}
.nav-header {padding: 0; max-width: 65px;}
.main_header_area .container {max-width: 100%;}
.me_tp_features, .stellarnav .menu-toggle:after {display: none;}
.stellarnav .menu-toggle {padding: 0 0 0 40px;}
.stellarnav.mobile {display: flex;height: 100%;justify-content: center;align-items: center;}
.stellarnav .menu-toggle span.bars span {width: 30px;height: 1px;border-radius: 0;background: #ffffff;margin: 0px auto 8px;}

.stellarnav.mobile.left > ul {border: none; box-shadow: 0 -5px 10px #00000040;}
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu {display: flex;background: #ffffff;padding: 15px;
    align-items: baseline;justify-content: flex-end;gap: 8px;letter-spacing: 0.1em;}
.stellarnav .icon-close:before, .stellarnav .icon-close:after, 
.stellarnav a.dd-toggle .icon-plus:before, .stellarnav a.dd-toggle .icon-plus:after {border-bottom: solid 2px #999;}
.stellarnav.mobile > ul > li {border-bottom: none; border-top: 1px solid #dfdfdf;}
.stellarnav.mobile > ul > li > a {color: #494949;line-height: 200%;padding: 12px 40px;border-bottom: none;}
.stellarnav.mobile > ul > li > a.dd-toggle {padding: 12px;}
}
@media screen and (max-width: 450px) {
.header_area {padding: 10px 0;}
.nav-header {max-width: 50px;}
.stellarnav .menu-toggle {padding: 0 0 0 30px;}
.stellarnav .menu-toggle span.bars span {margin: 0px auto 6px;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*大圖*/

@-webkit-keyframes totop {
	0% {transform: translateY(-20px);opacity: 0;}
	100% {transform: translateY(0px);opacity: 1;}
}
@keyframes totop {
	0% {transform: translateY(-20px);opacity: 0;}
	100% {transform: translateY(0px);opacity: 1;}
}

@-webkit-keyframes tobottom {
	0% {transform: translateY(20px);opacity: 0;}
	100% {transform: translateY(0px);opacity: 1;}
}
@keyframes tobottom {
	0% {transform: translateY(20px);opacity: 0;}
	100% {transform: translateY(0px);opacity: 1;}
}

@-webkit-keyframes toleft {
	0% {transform: translateX(-20px);opacity: 0;}
	100% {transform: translateX(0px);opacity: 1;}
}
@keyframes toleft {
	0% {transform: translateX(-20px);opacity: 0;}
	100% {transform: translateX(0px);opacity: 1;}
}

@-webkit-keyframes toright {
	0% {transform: translateX(20px);opacity: 0;}
	100% {transform: translateX(0px);opacity: 1;}
}
@keyframes toright {
	0% {transform: translateX(20px);opacity: 0;}
	100% {transform: translateX(0px);opacity: 1;}
}

/*大圖-第一張*/
.pageIndex .swiper-fade .swiper-slide:nth-child(1):before {
    content: "";position: absolute;background-image: url(https://pic03.eapple.com.tw/wens/indexbanner_word-03.svg);
    width: 15%;top: 36%;left: 15%;aspect-ratio: 28 / 18;background-size: contain;background-repeat: no-repeat;z-index: 999;}
.pageIndex .swiper-fade .swiper-slide:nth-child(1):after {
    content: "";position: absolute;background-image: url(https://pic03.eapple.com.tw/wens/indexbanner_word-04.svg);
    width: 32%;top: 36%;left: auto;right: 0;aspect-ratio: 665 / 180;background-size: contain;background-repeat: no-repeat;z-index: 999;}
/*大圖-第一張動畫*/
.pageIndex .swiper-fade .swiper-slide-active:nth-child(1):before {
    -webkit-animation: toleft 1.5s ease-in-out forwards;
	animation: toleft 1.5s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;}
.pageIndex .swiper-fade .swiper-slide-active:nth-child(1):after {
    -webkit-animation: toright 1.5s ease-in-out forwards;
    animation: toright 1.5s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;}

/*大圖-第二張*/
.pageIndex .swiper-fade .swiper-slide:nth-child(2):before {
    content: "";position: absolute;background-image: url(https://pic03.eapple.com.tw/wens/indexbanner_word-05.svg);
    width: 11%;top: 20%;left: 45%;aspect-ratio: 5 / 4;background-size: contain;background-repeat: no-repeat;z-index: 999;}
.pageIndex .swiper-fade .swiper-slide:nth-child(2):after {
    content: "";position: absolute;background-image: url(https://pic03.eapple.com.tw/wens/indexbanner_word-06.svg);
    width: 20%;top: 55%;left: 50%;aspect-ratio: 37 / 20;background-size: contain;background-repeat: no-repeat;z-index: 999;}
/*大圖-第二張動畫*/
.pageIndex .swiper-fade .swiper-slide-active:nth-child(2):before{
    -webkit-animation: tobottom 1.5s ease-in-out forwards;
	animation: tobottom 1.5s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;}
.pageIndex .swiper-fade .swiper-slide-active:nth-child(2):after{
    -webkit-animation: totop 1.5s ease-in-out forwards;
	animation: totop 1.5s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;}

/*大圖點點*/
.swiper-pagination-bullets.swiper-pagination-horizontal {bottom: var(--swiper-pagination-bottom, 30px);}
@media screen and (max-width: 600px) {
.swiper-pagination-bullet { width: 8px;height: 8px;}
}
@media screen and (max-width: 450px) {
.swiper-pagination-bullet { width: 5px;height: 5px;}
}

/*手機大圖*/
@media screen and (max-width: 600px) {}


/*內頁BANNER 設定*/
.banner {background: #fff;font-size: inherit;padding: 0;}
.banner h5 {font-size: 28px;font-weight: 300;letter-spacing: 0.15em;}
.banner.banA {}
.banner.banB {}
.banner.banC {}
.banner.banD {}
.banner.banE {}
.banner.banblog {}

@media screen and (max-width: 1024px) {}
@media screen and (max-width: 768px) {}
@media screen and (max-width: 600px) {}
@media screen and (max-width: 450px) {}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*FOOTER*/
#to_top {bottom: 95px;left: 0;box-shadow: unset;border-radius: 0;letter-spacing: 0.15em;padding-top: 12px;border: 1px solid #dfdfdf;border-left: none;}
#to_top i.top {width: 20px;height: 12px;}
#to_top i.top:before, #to_top i.top:after {height: 10px;width: 2px;}

.copy {padding: 25px 0;background: #444;font-size: 12px;color: #888;border-top: unset;margin-top: 30px;letter-spacing: 0.05em;}
.copy a {color: #888;}
.privacyLinks a {padding: 0 10px;}
.privacyLinks a+a {border-left: 1px solid #888;}

#bottom_menu li a {line-height: 3;padding: 20px 10px 10px;color: #494949;transition: 0.8s ease;}
#bottom_menu li a em {font-size: 14px;letter-spacing: 0.08em;}
#bottom_menu li a:hover {background: #000000;color: #fff;transition: 0.8s ease;}

@media screen and (max-width: 1024px) {}
@media screen and (max-width: 768px) {}
@media screen and (max-width: 600px) {}
@media screen and (max-width: 450px) {}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*文章設定A*/


@media screen and (max-width: 1024px) {}
@media screen and (max-width: 768px) {}
@media screen and (max-width: 600px) {}
@media screen and (max-width: 450px) {}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*文章設定B*/


@media screen and (max-width: 1024px) {}
@media screen and (max-width: 768px) {}
@media screen and (max-width: 600px) {}
@media screen and (max-width: 450px) {}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*購物車*/


@media screen and (max-width: 1024px) {}
@media screen and (max-width: 768px) {}
@media screen and (max-width: 600px) {}
@media screen and (max-width: 450px) {}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */