@charset "utf-8";

/*顏色：　　#308c96-湖水綠  #b6964e-金色  #efefef-灰色   #253536-墨綠色*/

.footer_info li p.add a:after{content: '(楓康超市旁)';}

body{font-family: "Philosopher", serif,"Noto Sans TC", serif;}

#content_main {  margin: 0;}
#content { background: url(https://pic03.eapple.com.tw/huaxiacar6930/bg_all.jpg); background-size: cover; background-repeat: no-repeat;}

.blog_page.article_a #content{/* background: #FFF;*/}
.stellarnav > ul > li:last-of-type, .footer_menu a:last-of-type{display:none;}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●//浮動*/
/*.info_fix_links{ display:block !important;}/*保持展開*/
/*.info_fix>span { display: none;}/*隱藏展開鈕*/

.linksBtn, .info_fix:hover>.linksBtn { background: #0b464b;}
.info_fix_links a{background: rgb(178 149 86 / .7);}
.info_fix_links a:hover {transition: 1.2s ease-in-out; transform: rotateY(360deg); background: rgb(178 149 86);}

.info_fix_links a:nth-of-type(even){background: rgb(48 140 150 /.7);}
.info_fix_links a:nth-of-type(even):hover { background: rgb(48 140 150);}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●//header+footer*/

/*○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○//*LOGO*/
.nav-header { background: linear-gradient(to bottom, #b6964e, #23737c, #308c96, #ffffff00);max-width: 100%;
background: linear-gradient(to bottom, #094c53, #23737c, #308c96, #ffffff00);}
.nav-brand img { padding:15px 30px 30px; filter: drop-shadow(3px 3px 4px rgba(0, 0, 0, 0.2));}

/*手機LOGO .nav-brand-m {} */

/*○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○//*header*/
.me_tp_features{display: none;}
.header_area { position: fixed; padding: 0px; background: linear-gradient(to bottom, #ffffff, #ffffff9e, #ffffff00); transition: .3s;}
.header_area.sticky{ background: linear-gradient(to bottom, #ffffff, #ffffff9e, #ffffff00); transition: .3s;}

.stellarnav ul { padding: 35px 10px 0 0;}
.main_header_area .container { max-width: 1600px;}
.navigation{grid-template-columns: 340px 1fr; grid-gap: 0;}

/*第一層*/
.stellarnav > ul > li > a {width: 87px; color: #000; font-size: 15px; margin: 0px; letter-spacing: 1px;  padding: 0px 5px;}
.stellarnav > ul > li:nth-of-type(4) > a {width: 110px;}
.stellarnav > ul > li:after { content: ''; background: url(https://pic03.eapple.com.tw/zhenxingclinic/bone.svg) no-repeat; background-size: cover;
position: absolute; opacity: 0; transition: all .4s; left:35%; top: -100px; width: 30px; height: 30px;}
.stellarnav > ul > li:hover:after { opacity: 1; top: -20px; transition: all .4s;}

.stellarnav > ul > li:nth-of-type(even):after { background-image: url(https://pic03.eapple.com.tw/zhenxingclinic/bone_gl.svg);}

.stellarnav > ul > li > a:hover { background: #ffffff; border-radius: 50px; box-shadow: 2px 2px 4px #4444441c;}
.stellarnav li.has-sub > a:after{right: 5px;border-top: 6px solid #b99d54;}

.stellarnav > ul > li > a { padding: 0px 5px;}
.stellarnav > ul > li.has-sub > a, .stellarnav > ul > li.has-sub > a:hover { padding-right: 17px;}

/*第二層*/
.stellarnav ul ul { width: 300px;padding: 0px; border-radius: 50px; background: transparent;right: -50px;}
.stellarnav ul li:nth-of-type(2) ul li:first-of-type{display:none;}
.stellarnav ul li:nth-of-type(5) ul { width: 185px;}
.stellarnav ul li:nth-of-type(6) ul { width: 220px;}
.stellarnav li li { border-radius: 50px; border: none; background: #FFF; margin: 5px 5px;}
.stellarnav li li a{ transition: all .5s; border-radius: 50px; padding-left: 25px; box-shadow: 2px 2px 3px #44444430;}
.stellarnav li li a:hover { transition: all .5s; background: #2e7b83; color: #FFF;padding-left: 30px; } 

@media screen and (max-width: 768px) {
.stellarnav.mobile > ul > li > a { width: auto;}


}

/*○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○//*FOOTER*/
.footer{ padding: 30px 0 0; background: #b0aca0;}
.footer .center{max-width: 1200px;padding: 0 3%;}

.footer_logo { width: 200px;margin-right: 16px;}
.footer_logo img { }

.footer_info {flex-direction: column-reverse;grid-gap: 0;padding: 0;display: flex;align-items: center;justify-content: space-around;}
.footer_info ul{}

.footer_info li{padding: 10px 0;display: inline-block;vertical-align: middle;width: 100%; text-align: center;}
.footer_info li:nth-child(1){}
.footer_info li:nth-child(2){}

.footer_info li p, .footer_info li p a {color: #393939;}

.footer_menu a {padding: 5px 7px 4px; background: transparent; color: #fff;}
.footer_menu a:hover {background: #308c96;}

/*○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○//*copy*/	
.copy {border-top: 1px solid #bcbcbc;padding: 10px;}
.copy,.copy a {color: #fff;  background: #b6964e; font-size: 12px;font-weight: 200;}

/*○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○//*box_link*/	
.box_link {top: 100%;width: 100%;padding: 0 3%;max-width: 300px;display: block;margin: 10px auto;text-align: center;position: relative;}
.box_link a {display: inline-block;width: 30px;height: 30px;border: none;
             padding: 0px;border-radius: 30px;background: transparent;color: #eee;margin: 0 6px;transition: all .3s;}
.box_link a:hover{transform: translateY(-5px);}
.box_link a i {color: #525252;}

@media screen and (max-width: 1024px){
.header_area {  position: sticky; background: #FFF; }
.header_area.sticky { background: #FFF }
.nav-brand img { padding: 15px 30px;max-width: 300px;}
.nav-header { background: linear-gradient(to bottom, #b6964e, #308c96,  #308c96);
background: linear-gradient(to bottom, #094c53, #308c96, #308c96);}
.stellarnav ul { padding: 5px 25px 0; background: #eaeaea;}

}
@media screen and (max-width: 768px) {
/*header*/
.nav-brand img { padding: 5px; filter: none; max-width: 250px;}
.nav-header { background: transparent}
.header_area, .header_area.sticky { background: linear-gradient(to bottom, #b6964e, #308c96,  #308c96);
background: linear-gradient(to bottom, #094c53, #308c96, #308c96);}

.stellarnav .menu-toggle { padding: 20px 10px;}
.stellarnav .menu-toggle:after { color: #FFF;}
.stellarnav .menu-toggle span.bars span { background: #FFF;}

/*選單*/
.stellarnav ul ul{right: 0;}
.stellarnav.mobile.left > ul { padding: 20px;}
.stellarnav.mobile > ul > li > a{}
.stellarnav ul {  padding:5px 25px 0;background: #e9e9e9;}
.stellarnav > ul > li:after{  display: none;}
.stellarnav.mobile li.open li.open { background: transparent;}

.stellarnav.mobile > ul > li > a.dd-toggle, .stellarnav.mobile li li a.dd-toggle{ 
padding-right: 17px;background-color: transparent; color: inherit; box-shadow: none;}

.stellarnav.mobile li li a.dd-toggle:hover {background-color: transparent; color: inherit;box-shadow: none;}

.stellarnav.mobile li li a.dd-toggle { padding: 8px 0px 0px 0px;}
.stellarnav a.dd-toggle .icon-plus { padding: 10px 0px;}

.stellarnav li li { margin: 5px 0px;}

.stellarnav.mobile li li.has-sub a:not(.dd-toggle) { margin-bottom: 15px;}
.stellarnav > ul > li.has-sub > a:hover { background: transparent; color: inherit; box-shadow: none; border-radius: 0px;}

.stellarnav li li a{ padding-left: 20px;box-shadow: none;}
.stellarnav li li a:hover{ background-color: #FFF; color:#444}
.stellarnav.mobile ul ul {
    width: 90% !important;
}

.stellarnav.mobile li.open li.open>a:not(.dd-toggle) { background: #ececec; color: #444; box-shadow: none; border-radius: 0px;}

/*底色*/
.stellarnav.mobile.right > ul, .stellarnav.mobile.left > ul {max-width: 90%; background: #fffffff5;}
.stellarnav.mobile li.open {background: #fff; padding:0;}

/*close*/
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu { background: transparent; color: #9f9f9f;}
.stellarnav .icon-close:before, .stellarnav .icon-close:after{border-color: #d0b970;}

/*第一層*/
.stellarnav > ul > li.has-sub > a {}
.stellarnav.mobile li.open a{padding-bottom: 0px;}
.stellarnav.mobile li li a{padding-bottom: 8px !important;background: #eeeeee;}

.stellarnav a.dd-toggle .icon-plus:before, .stellarnav a.dd-toggle .icon-plus:after{border-bottom: solid 3px #308c96;}

/*第二層*/
.stellarnav.mobile ul ul { background: transparent; margin: 0 10px;}
.stellarnav li li, .stellarnav li li a{border-radius: 0;}
.stellarnav li li a:hover {background-color: #308c96; color: #ffffff;}
	
.footer.with_shopping_mode { padding: 30px 0 35px; }
.footer_info li+li { margin-top: 0;}

#to_top { bottom:60px;}

#bottom_menu { background: #876e38; box-shadow: none;}
#bottom_menu li a { padding: 10px 5px; color: #fff;}
#bottom_menu li a em { display: none}

}
@media screen and (max-width: 570px) {
.stellarnav .menu-toggle { padding: 20px 10px;}
}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●///內頁大圖*/
.path p, .path p a {display: none;}

.banner {background: url(https://pic03.eapple.com.tw/zhenxingclinic/ban_pic.png) no-repeat;background-repeat: no-repeat;
         height: 350px;background-size: cover;background-position: right;}
		 
.banner h5 {width: 90%;margin: 0 auto;color: #333;font-size: 24px;z-index: 100;position: relative;font-weight: 400; letter-spacing: 4px;padding-top: 35px;}
.banner h5:before {content: "ZHENXING";display: block;font-size: 30px;color:#308c96;font-weight: bold;}

@media screen and (max-width: 1024px) {
.banner { height: 250px;}
}
@media screen and (max-width: 600px) { 
.banner h5:before {}
}
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●///購物車-診療項目*/
/*首頁顯示*/
.pageIndex .products-list, .products-list {  max-width: 900px;  grid-template-columns: repeat(4, 1fr); grid-gap: 10px;margin: auto;}
.prod_part, .product_page .main_part { padding: 0; max-width: 1000px; margin: auto;}
.prod_part section { max-width: 1300px; margin: 50px auto;}

/*購物車首頁*/
.products-list .pic, .related_list li figure { border-radius: 100%; margin: 5%;max-width: 150px; margin: auto;transition: all 1.5s ease;}
.products-list .pic img {/*transform: scale(0.8);*/}

.products-list li:hover .pic, .related_list li:hover figure{transform: scale(1);transition: all 1.5s ease;}

.products-list li .pic img, .related_list li figure img{ transition: all 1.5s ease;}
.products-list li:hover .pic img, .related_list li:hover figure img{transform: scale(1.3); transition: all 1.5s ease;}

.products-list .name { -webkit-line-clamp: 5;text-align: center;font-size: 16px;max-width: 80%; margin: 10px auto;}
.products-list .more {display:none;}
.products-list .item a { padding-bottom: 10px;}
.product_menu_list { margin-bottom: -40px;}
.product_page .show_content {  padding: 0;}

/*內頁*/
.mobile_product_name { display: none !important;}
.sidebarBtn { display: none;}
.pd_tabTitle { display: none;}
.pd_tabInner_contain { padding-top: 0;}
.prod_tabs {  margin-top: 0;}
.pd_tabInner_contain {  padding-top: 0;}
.product_info_page .main_part { padding: 0 !important; max-width: 100%;}
.swiper-wrapper { flex-direction: row;}

/*改圖片區域*/
.product_main { width: 100%;padding: 5%;background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;background-image: url(https://pic03.eapple.com.tw/zhenxingclinic/yu_i_bg5.jpg); }	
.product_info_page .show_content {  padding: 0;}
.product-wrapper { display: flex; flex-direction: column-reverse;}
#prod_thumbSwiper .swiper-slide {height: auto !important; aspect-ratio: 1 / 1; overflow: hidden;}
#prod_thumbSwiper { width: 15%; max-width: 15%;}
.product_pic { padding-left: calc(15% + 15px);max-width: 800px; margin: auto;}
.proImgSwiper .swiper-button-next:after, .proImgSwiper .swiper-button-prev:after {text-shadow: none;}


@media screen and (max-width: 768px) {
.product_pic {padding: 0;}
#prod_thumbSwiper {width: 100%; max-width: 100%;}
			
}

/*相關推薦*/
.prod_related h6 span:before { content: '其他診療項目';}
.related_list li a {  padding: 0; background: transparent;}
.related_list { grid-template-columns: repeat(4, 1fr);}

.prod_related h6, .related_list, .prod_related_b_box{max-width:1000px; margin:auto;}
.product_info_page .lastPage { margin: 20px auto 0;}
.prod_related { padding: 5%; background: transparent;}
.prod_related h6{margin-bottom: 20px;}
	
@media screen and (max-width: 980px) {
.products-list { grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));}
}
@media screen and (max-width: 768px) {			
}
@media screen and (max-width: 600px) {
.products-list { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));}
}
@media screen and (max-width: 450px) {			
.related_list { grid-template-columns: repeat(2, 1fr);}
}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●///文章共用*/
/*首頁顯示*/
.module_i_news ul { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));}
.module_i_news li a {display: flex;flex-wrap: wrap;}

.module_i_news li a:after { background: transparent; border: 2px #1b8f9c solid;}
.subbox_item a:after { background: transparent; border: 2px #1b8f9c solid;}

.module_i_news li a:before, .subbox_item a:before { background: #308c96; color: white; padding: 20px;}

.module_i_news {background: #f3f3f366;}
.module_i_news .title_i_box h6 { color: #308c96;}
.module_i_news .title_i_box h4 {font-size: 20px;color: #444;font-weight: 400;}

.i_blog_ri h5{font-size: 18px;}
.i_blog_ri{text-align: center;}

.blog_page.article_a h4.blog_category_title{display: none;}

/*文章側邊選單*/
.blog_le .accordion {border-radius: 0px;border: none;}
.accordion li .link a {font-weight: 400;}
.blog_le .accordion > li:hover, .blog_le .accordion > li.on_this_category {background: #ad9046 !important;}
.submenu li.on_this_category a, .submenu a:hover {background: #d3d3d3;color: #FFF;}
h5.blog_le_t {font-family: "Philosopher", serif;text-align: center;margin-bottom: 25px;display: none;}
h5.blog_le_t em {  /*  display: none;*/}

/*文章內頁*/
h4.blog_category_title {font-size: 25px;font-weight: 400;letter-spacing: 1px;background: #ffffff;padding: 10px 20px;border-radius: 50px;}
.blog_box_edit * {color: #333;}
.blog_box_edit { display: flex; flex-direction: column-reverse;}

.blog_back a.article_btn_back {background: #b9b9b9;}
.blog_back a.article_btn_prev, .blog_back a.article_btn_next {background: #308c96;}

/*相關文章*/
.news_related {background: #308c960d;}
.news_related h6 span:before {content: 'Read More';font-size: 24px;color: #515151;}
.news_related h6 {margin: 0 auto 50px;}
.news_related_list li a:hover {box-shadow: 3px 3px 3px #ccc;transition: .5s;}
.news_related_list li a{transition: .5s;}
.lastPage{border: 1px solid gainsboro; background: #FFF; color: #444; border-radius: 50px;}
.lastPage:hover{background: #308c96;color: #FFF;transition: .3s;}
.news_related_list li a p {font-size: 16px;color: #333;line-height: 2;font-weight: 500;padding: 15px;letter-spacing: 1px;}
.news_related_list li a img {/*border-top-left-radius: 200px; border-top-right-radius: 200px;*/}

.blog_in_page iframe{ width:1000px !important; height:500px !important;}

@media screen and (max-width: 768px) {
h5.blog_le_t { display: block;}
h4.blog_category_title{ padding: 0;}
.blog_in_page iframe{height:300px !important;}
}


/*○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○///最新消息-文章 module_i_news01 article_a*/
.module_i_news01 ul, .article_a .blog_subbox {grid-template-columns: 1fr;}
.module_i_news01 li .i_blog_le, .article_a .blog_list_le {display:none;}
.module_i_news01 li a {background: white;max-width: 800px; margin: auto;}

.module_i_news01 .i_blog_ri {display: flex; flex-wrap: wrap; align-items: center; gap: 5px 15px; padding: 3% 5%;}
.module_i_news01 .i_blog_ri em { order: 1; margin: 0;width: 115px;}
.module_i_news01 .i_blog_ri h5 { order: 2; font-size: 16px; color: #484848;-webkit-line-clamp: 2; text-align: justify;width: 75%;}
.module_i_news01 .i_blog_ri p {  order: 3; line-height: normal;-webkit-line-clamp: 7;text-align: justify;width: 100%;}

/*文章首頁*/
.article_a .subbox_item a{background: white; border: 1px solid #c6c6c6; padding: 2% 3%;grid-template-columns: 1fr;}
.article_a .subbox_item a:after {}

.blog_page.article_a .blog_list_ri { display: flex; flex-direction: column; letter-spacing: 2px;}
.blog_page.article_a .blog_list_ri em {order: 1;}   
.blog_page.article_a .blog_list_ri p {padding-top: 15px;order: 3;}    
.blog_page.article_a .blog_list_ri h5 {order: 2;}


	
/*以上更新過*/

.blog_page.article_a .subbox_item a:hover .blog_list_le img {transform: scale(1.1);transition: all .6s ease;}


/*○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○///衛教專欄-文章 module_i_news02 article_b*/

.module_i_news02 .i_blog_ri { text-align: left;}
.module_i_news02 li a { grid-gap: 0px;}
.module_i_news02 .i_blog_ri em { margin: 2px 0 5px;}
.module_i_news02 li .i_blog_le{border: 4px solid #d1e9eb;border-radius: 20px;}
.article_b .blog_list_le {border: 4px solid #d1e9eb;}

.blog_page.article_b .blog_subbox {grid-template-columns: 1fr;}
.blog_page.article_b .blog_list_ri h5 {font-weight: 400;font-size: 24px;-webkit-line-clamp: 6;}
.blog_page.article_b .subbox_item a {grid-template-columns: 260px 1fr;width: 100%;background: #f6f6f6;}
.blog_page.article_b .blog_list_ri {display: flex;flex-direction: column;justify-content: center;padding: 5px 10px 5px 0px;}
.blog_page.article_b .blog_list_ri p {font-size: 16px;letter-spacing: 1px;color: #666;padding-top: 30px;}
.blog_page.article_b .subbox_item a:after, .module_i_news02 .subbox_item a:before{}
.blog_page.article_b h4.blog_category_title{display: none;}


@media screen and (max-width: 768px) {
    h4.blog_category_title {    font-size: 20px;    font-weight: 500;    background: #ffffff;    border-radius: 10px;}
	.module_i_news01 li { border-bottom:none;}
}  
@media screen and (max-width: 500px) {
.blog_page.article_b .subbox_item a {grid-template-columns: 1fr;}	
.blog_page.article_b .blog_list_ri {padding: 0 10px 10px;}

}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●///按鈕*/
.animated-arrow {background: #FFF;border-radius: 50px;border: 1px solid #dfdfdf;color: #898989; font-size: 15px;}
.animated-arrow:hover {background: #33838b;color: #FFF;transition: .3s;}

.i_blog_b a b{font-weight: 500;}

/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●///首頁大圖*/
/*================================================BANNER*/
/*首頁大圖*/
/*預設解除背景輪播*/
.bannerindex { position:relative; height:auto;}
.swiper-banner { position:static; margin:0; height:auto;} 


/*大圖文字*/
.bannerindex .swiper-wrapper:before {
    content: "";
   /* background-image: url(https://pic03.eapple.com.tw/change/BN.png);*/
    width: 100%;
    height: 100%;
    background-size: contain;
    position: absolute;
    z-index: 101;
    animation: tracking-in-contract-bck2 1.5s both;
    aspect-ratio: 311 / 60;
}

.bannerindex .swiper-slide{position: relative;}
.bannerindex .swiper-slide:before, .swiper-slide:after {
    content: "";
    position: absolute;
    z-index: 999;
    pointer-events: none;
    transition-duration: 2s;
    transition-timing-function: linear;
}

.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):before, .swiper-slide.swiper-slide-active:nth-child(1):after,
.bannerindex .swiper-slide.swiper-slide-active:nth-child(2):before, .swiper-slide.swiper-slide-active:nth-child(2):after {
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
	top: 0;
    background-size: contain;
    position: absolute;
    z-index: 101;
    animation: upin 1.5s ease;
	
}
.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):before{ background-image: url(https://pic03.eapple.com.tw/zhenxingclinic/BNA1.png);}
.bannerindex .swiper-slide.swiper-slide-active:nth-child(2):before{ background-image: url(https://pic03.eapple.com.tw/zhenxingclinic/BNB1.png); animation: leftin 1.5s ease;}
/*
.swiper-slide.swiper-slide-active:nth-child(1):after{
    background-image: url(https://pic03.eapple.com.tw/change/BNA2.png);
    animation: tracking-in-contract-bck2 1.5s ease;
}
.swiper-slide.swiper-slide-active:nth-child(2):after{
    background-image: url(https://pic03.eapple.com.tw/change/BNB2.png);
    animation: tracking-in-contract-bck2 1.5s ease;
}*/


@keyframes upin {
 0% { transform: translateY(10%); opacity: 0;}
 60% { transform: translateY(0);}
 70% { transform: translateY(1%);opacity: 1;}
 100% { transform: translateY(0);}
}
@keyframes leftin {
 0% { transform: translateX(10%); opacity: 0;}
 60% { transform: translateX(0);}
 70% { transform: translateX(1%);opacity: 1;}
 100% { transform: translateX(0);}
}
@media screen and (max-width: 768px) {
    .bannerindex {  padding-bottom: 0;}
}

/*
@keyframes tracking-in-contract-bck2 {
 0% { transform: translateY(10%); opacity: 0;}
 60% { transform: translateY(0%);opacity: 1;}
 75% { opacity: 0;}
 90% { opacity: 1;}
 100% { transform: translateY(0);}
}*/

/*預設解除背景輪播*//*

.bannerindex { position:relative; height:auto;}
.swiper-banner { position:static; margin:0; height:auto;} 
/* .swiper-slide img { height:auto;} *//*

.bannerindex { position: static; height: auto;}
@media screen and (max-width: 768px) {
    .bannerindex { padding:0; margin:0;}
}

.swiper-banner { position: static; margin: 0; height: auto;}
.swiper-slide { padding: 0px !important;}

.swiper-slide img { height: auto;}
.swiper-pagination { display: none;}
.swiper-slide { position: relative;}
.bannerindex .swiper-slide.swiper-slide-active:before {content: ""; position: absolute;  z-index: 999; pointer-events: none;}
.bannerindex .swiper-slide.swiper-slide-active:after {content: ""; position: absolute;  z-index: 999; pointer-events: none;}

/*第一張大圖*//*
.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):before {
    background: url(https://pic03.eapple.com.tw/syskincare/title.svg);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: 16%;
    left: 8%;
    width: 60% !important;
    height: 60% !important;
    background-position: left;
    padding-bottom: calc(100% / 1* 0.12);
}

.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):after {
    background: url(https://pic03.eapple.com.tw/syskincare/people.png);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: 0px;
    right: 0px;
    width: 85% !important;
    height: 85% !important;
    background-position: right;
    padding-bottom: calc(100% / 1* 0.12);
}


.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):before { animation:fade-in-top 0.8s cubic-bezier(.1,.300,.400,0.2) both}
.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):after {animation:fade-in-right 1.3s cubic-bezier(.39,.575,.565,1.000) both}




/*第二張大圖*//*
.bannerindex .swiper-slide.swiper-slide-active:nth-child(2):before {
    background: url(https://pic03.eapple.com.tw/syskincare/title2.svg);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: 18%;
    left: 31%;
    width: 35% !important;
    height: 60% !important;
    background-position: left;
    padding-bottom: calc(100% / 1* 0.12);
}



.bannerindex .swiper-slide.swiper-slide-active:nth-child(2):before { animation:fade-in-top 1.3s cubic-bezier(.1,.300,.400,0.2) both}



  @keyframes fade-in-top {
    0% {
      -webkit-transform: translateY(-50px);
              transform: translateY(-50px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      opacity: 1;
    }
  }

  @keyframes fade-in-right {
    0% {
      -webkit-transform: translateX(50px);
              transform: translateX(50px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
      opacity: 1;
    }
  }
  
  
@media screen and (max-width: 600px) { 

/*RWD大圖*//*

.bannerindex .swiper-slide img { display:none; }
.bannerindex .swiper-slide {height: 130vw;  width: 100% !important; }/*圖片比例*//*
.bannerindex .swiper-slide:nth-child(1) { background-image: url(https://pic03.eapple.com.tw/syskincare/rwd1.jpg); background-position: top; background-size:cover;}/*個別換背景*//*
.bannerindex .swiper-slide:nth-child(2) { background-image: url(https://pic03.eapple.com.tw/syskincare/rwd2.jpg); background-position: top; background-size:cover;}

/*第一張大圖*//*
.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):before {
    background: url(https://pic03.eapple.com.tw/syskincare/rwd1-2.svg);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: 32%;
    left: 7%;
    width: 60% !important;
    height: 60% !important;
    background-position: left;
    padding-bottom: calc(100% / 1* 0.12);
}

.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):after {
    background: url(https://pic03.eapple.com.tw/syskincare/rwd1-1.png);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: -17%;
    right: -7%;
    width: 100% !important;
    height: 100% !important;
    background-position: right;
    padding-bottom: calc(100% / 1* 0.12);
}


/*第二張大圖*//*

.bannerindex .swiper-slide.swiper-slide-active:nth-child(2):before {
    background: url(https://pic03.eapple.com.tw/syskincare/title2.svg);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: -22%;
    left: 4%;
    width: 91% !important;
    height: 99% !important;
    background-position: left;
    padding-bottom: calc(100% / 1* 0.12);
}
}