@charset "utf-8";
/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */




/*all*/
/*.box_container { margin-top: -100px;}
.main_part {   width: 100%; max-width: 1700px; margin: -110px auto 0;  padding: 0px 20px; background: #fff;  border-radius: 120px 120px 0px 0px;   overflow: hidden;}*/
.show_content {  margin: auto;  padding: 70px 20px;}

.info_fix:hover>.linksBtn {background: #856a2d;}
.linksBtn { background-color: #b2984b;}
.info_fix_links a { background: rgb(178 152 75);}
.info_fix_links a:hover {  background: rgb(138 114 59);}

 .album_info_page .banner,.blog_in_page .banner,.car_page .banner,.album_class_page .banner, .product_info_page .banner,.other_page .banner, .product_page .banner,.blog_page .banner,.album_page .banner{ display: none;}

.banA {
    display: none;
}

.other_select_page .page{display:none;}

.page {
    margin: 80px 0 0 0;
    font-size: 16px;
    color: #545454;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
    /* display: none; */
}
.promotion_title {
    display: none;
}
.other_promotion {
    list-style: none;
    display: grid;
    margin: 0 auto;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    grid-gap: 15px;
    display: none;
}


/*banner*/
.banC {
  position: relative;
  z-index: 1;
  height: 300px;
  overflow: hidden; /* 避免超出 */
	
  background-image: 
    linear-gradient(180deg, #bababa7d 40%, rgb(255 255 255 / 0%) 65%), 
    url(https://pic03.eapple.com.tw/tupomarket/ban02.jpg);

  background-size: cover;
  background-repeat: no-repeat;
  background-position: center 0; /* 初始對齊上方 */

  animation: bgScroll 30s linear  forwards;
}

@keyframes bgScroll {
  0%   { background-position: center 0%; }
  100%  { background-position: center 100%; }
}


.banC{  background-image:linear-gradient(180deg, #bababa7d 40%, rgb(255 255 255 / 0%) 65%), 
    url(https://pic03.eapple.com.tw/yulimanpower/banner.jpg);}




.banner h5 {
    font-size: 22px;
    color: #ffffff;
    position: relative;
    letter-spacing: 3px;
    z-index: 999;
    width: 100%;
    animation: slide-top 1.5s 0.5s both;
    filter: drop-shadow(2px 4px 6px black);
    top: 0px;
    /* bottom: 100px; */
    top: -40px;
    }
	
.banC h5:before {
    content: "CONTACT";
    position: absolute;
    left: 50%;
    top: 65px;
    font-size: 20px;
    letter-spacing: 7px;
    /* border: 1px solid; */
    background-color: #ffffff00;
    padding: 7px 43px;
    text-indent: 7px;
    text-align: center;
    width: auto;
    transform: translateX(-49%);
    }
	
@keyframes slide-top {
    0% { -webkit-transform: translateY(100%);transform: translateY(100%); opacity:0; }
    100% {-webkit-transform: translateY(0); transform: translateY(0); opacity:1;}
}

 




.nav-brand img {
    max-width: 100%;
    justify-content: center;
}


.header_area {
	padding: 10px 20px;
	background-color: #712275;
	background-size: 600% 600%;
	
}


.header_area.sticky {
    background-color: #5a1c816e;
    box-shadow: 0px 3px 10px #00000030;
    backdrop-filter: saturate(100%) blur(5px);
    position: sticky;
    /* top: 10px; */
}

.header_area:after {
    content: "";
    position: absolute;
    display: block;
    width: 0%;
    height: 3px;
    background: linear-gradient(45deg, #5f1083, #fec9ff);
    transform: translate(-20px, -1px);
    transition: .5s;
	
}
.header_area.sticky:after {
    width: 100%;
    transition: .5s;
}




.stellarnav > ul > li > a {letter-spacing: 1px;padding: 0 5px;line-height: 60px;height: 60px;margin: 0 9px;overflow: inherit;transition: 0.5s;color: #ddbd84;font-weight: 1000;font-size: 18px;}

.main_header_area .container {max-width: 1630px;transition: 0.8s;}
.navigation {grid-template-columns: 250px 1fr 120px;align-items: center;}
.stellarnav ul { text-align: right;}
.stellarnav li.has-sub > a:after{display: none;}
.stellarnav > ul > li.has-sub > a { padding-right: 0px;}

/*.stellarnav > ul > li>a:after {
    content: ""; height: 3px;  width: 0%; background: #af9a68; bottom: 0;
    left: 50%; position: absolute; transition: 0.8s; transform: translateX(-50%);}
.stellarnav > ul > li:hover>a:after { width: 100%;} */

.stellarnav li a {
    padding: 10px 10px;
    display: block;
    color: #777;
}

.stellarnav .menu-toggle span.bars span {
    display: block;
    width: 24px;
    height: 2px;
    border-radius: 6px;
    background: #ffffff;
    margin: 0 auto 4px;
}
.stellarnav .menu-toggle:after {
    content: 'MENU';
    font-size: 12px;
    color: #ffffff;
    display: block;
    transform: scale(0.9);
}



@media screen and (max-width: 375px) {
	
.nav-brand img {
    max-width: 100%;
    justify-content: center;
}
.header_area {
    padding: 20px;
}

	.header_area.sticky .container
max-width: 100%;
}
.banC {height: 180px;}

.banner h5 {
    font-size: 24px;
    color: #ffffff;
    position: relative;
    letter-spacing: 3px;
    z-index: 999;
    width: 100%;
    animation: slide-top 1.5s 0.5s both;
    filter: drop-shadow(2px 4px 6px black);
    top:-15px;
    }
	
.banC h5:before {
    content: "CONTACT";
    position: absolute;
    left: 50%;
    top: 30px;
    font-size: 20px;
    letter-spacing: 7px;
    /* border: 1px solid; */
    background-color: #ffffff00;
    padding: 7px 43px;
    text-indent: 7px;
    text-align: center;
    width: auto;
    transform: translateX(-49%);
    }	

 .main_part { padding: 0px 10px 10px;}	
	
}









/*下滑*/
.header_area.sticky .container { max-width: 95%;}
/*.header_area.sticky {  background: #950000; box-shadow: 0px 3px 10px #00000030;}*/


/*hover*/
.stellarnav ul:hover li a { opacity: 0.8; transition: all 0.3s ease-in-out;}
.stellarnav ul li:hover a {opacity: 1;transition: all 0.3s ease-in-out;}
.stellarnav > ul > li:hover > a { letter-spacing: 3px; }



/*次分類*/
.stellarnav ul ul {border-radius: 10px;}
	.stellarnav.desktop li.has-sub li> a {font-family: noto sans tc;font-weight: 500;}
.stellarnav.desktop li.has-sub li:hover > a {background: #E2B896;color: #fff;padding: 10px 20px;text-align: center;font-family: noto sans tc;font-weight: 500;border-radius: 10px;}

.stellarnav li li {
    display: block;
    border: 1px #eeeeee00 solid;
    border-bottom-width: 0;
    border-radius: 10px;
}

.album2_classes li a[href="https://www.chengfengcar.com/photo/class.php"] {
    display: none;
}



/*上方選單右邊設定 臉書/LINE/電話/信箱*/
.me_tp_features {width: 180px;order: 2;display: none;}
.tp_links { display: flex; justify-content: flex-end;}
.tp_links a { font-size: 16px; color: #ffffff; margin: 0;}
.me_tp_features a i {margin: 0 8px;color: #9b7f2b;}
.me_tp_features a:hover i { color: #E2B896;}

/*電腦LOGO*/
.nav-brand {display: flex;align-items: center;justify-content: center;}
.nav-header {max-width: 250px;grid-row: auto;}


/* 商品下拉超過30個變大 */
.stellarnav.desktop li.bigMenu>ul{display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); left: 0; width: 100%; position: fixed; padding: 20px;}
.stellarnav.desktop li.bigMenu ul ul{top: 100%; left: 0; width: 100%; background: #efefef; height: auto; max-height: 300px; overflow: auto;}
.stellarnav.desktop li.bigMenu ul ul li{margin: 0;} 
.stellarnav.hasBigMenu li.bigMenu li.has-sub > a:after{border-left: 6px solid transparent; border-bottom:unset; border-right: 6px solid transparent; border-top: 6px solid #898989; right: 5px;}





/*大圖動畫*/














/* = = = footer = = = = = = = = = = = = = = = = = = = = = = = = = = = = = */
.footer_info li p.line:before {
    content: '官方Line：';
}
	.footer_info li p.add2:before {
    content: '許可證號：';
}
.footer_logo img {
    max-width: 160%;
}
.footer_logo  {
    background: url(https://pic03.eapple.com.tw//) no-repeat center;
    width: 100%;
    height: 100%;
    margin-top: 50px;
    padding-right: 80px;
}

.footer {
    padding: 30px 0 0;
    font-size: 14px;
    background: #6c2669;
    position: relative;
    z-index: 99;
}



.footer_info {
    padding: 0;
    grid-template-columns: 350px 1fr;
    row-gap: 0;
    column-gap: 90px;
    }
.footer_info ul { 
    display: inline-flex;
    vertical-align: top;
    align-items: center;
    font-family: "Noto San TC", sans-serif;}

/*footer_info*/
.footer_info li:nth-child(1) { display: inline-block; width: 100%; padding: 20px 10px;}
.footer_info li p {color: #ffffff;}
.footer_info li p a { color: inherit;}

/*footer_menu*/
.footer_info li:nth-child(2) { display: inline-block; width: 100%; vertical-align: top;}
.footer_menu { margin-top: 10px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(130px,100%), 1fr)); gap: 5px;}/*footeræŒ‰éˆ•æœ€å°å¯¬åº¦100px*/

.footer_menu a {
    color: #ffffff;
    font-size: 1rem;
    letter-spacing: 0.05em;
    text-decoration: none;
    position: relative;
    display: inline-block;
    transition: transform 0.3s ease-out, color 0.3s ease-out;
    background-color: transparent;
    border: 0;
    z-index: 0;
}

.footer_menu a:hover {
    color: #c9b22a;
    background: transparent;
}

/* 光暈效果 */
.footer_menu a::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 40%;
    width: 0;
    height: 0;
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(0);
    background: radial-gradient(
        circle,
        rgba(255, 255, 255, 0.4) 0%,     
        rgb(216 187 108 / 50%) 40%,   
        rgba(216, 187, 108, 0) 100%
    );
    opacity: 0;
    pointer-events: none;
    z-index: -1;
}

/* 滑鼠移上觸發爆炸光暈 */
.footer_menu a:hover::before {
    animation: burstCircleTiny 0.7s ease-out forwards;
}

/* 小光暈動畫 */
@keyframes burstCircleTiny {
    0% {
        width: 0;
        height: 0;
        opacity: 0.8;
        transform: translate(-50%, -50%) scale(0.1);
    }
    60% {
        width: 70%;
        height: 70%;
        opacity: 0.4;
        transform: translate(-50%, -50%) scale(1);
    }
    100% {
        width: 90%;
        height: 90%;
        opacity: 0;
        transform: translate(-50%, -50%) scale(1.1);
    }
}
.box_link {display: none;}
.box_link a { transition:all 0.3s;}

.box_link a:hover { background: #D1BB9E; border-color: #D1BB9E;}
.box_link a:hover .fa-whatsapp:before, .box_link a:hover .fa-envelope::before, .box_link a:hover .fa-facebook::before, .box_link a:hover .fa-line::before , .box_link a:hover .fa-instagram::before { color: #fff;}


.copy {background: #52175e;color: #fff;border: none;}
.copy a { color: #fff; transition:all 0.3s;}

/*--RWD---------------------------------------*/

@media screen and (max-width: 1024px) {
    .footer_info {display: flex ; flex-wrap: wrap ; align-items: center ; padding: 20px;}
    .footer_menu {margin-top: 10px ; display: grid ; grid-template-columns: repeat(3, 1fr) ; gap: 5px;}
    .footer_info ul {width: 100% ; padding: 0;}
    .footer_info li:nth-child(1) {
        display: grid;
        padding-left: 5%;
        align-content: space-between;
        width: 50%;
    }
}
@media screen and (max-width: 768px) {
    /*footer*/
    .footer_info { justify-content: center;}
    .footer_logo {text-align: center;/* padding-right: 50px; */margin-top: 0px;padding-right: 80px; padding-right: 100px;}
    .footer_info ul { flex-direction: column;}
    .footer_info li:nth-child(1) {text-align: left;width: 100%;}
    .footer_info li:nth-child(2) { width: 100%; border-left: none;}

   
    #to_top { bottom:60px;}
    .footer.with_shopping_mode {/* padding:30px 0 70px; */}
}

@media screen and (max-width: 600px) { 
    /*footer*/
    .footer_info ul { width: 100%;}
    .footer_menu{    grid-template-columns: 1fr 1fr;}

    /*è¯çµ¡icon*/
    .box_link { text-align: center;}
}







/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */
/*預設解除背景輪播*/
#content_main { margin:0;}
.bannerindex {position: relative;height:auto;}
.swiper-banner { position:static; margin:0; height:auto;} 
/* .swiper-slide img { height:auto;} */
@media screen and (max-width: 768px) {
.bannerindex { padding:0; margin:0;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */
/*內頁BANNER 設定*/
.path p, .path p a { text-align: left;  padding-bottom: 50px;}
.path  {display: none;}


/*文章*/



	
	.blog_subbox {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(480px, 1fr));
    grid-gap: 20px;
}
.subbox_item a:before {
    content: 'READ MORE';
    position: absolute;
    z-index: 19;
    bottom: 10px;
    right: 10px;
    opacity: 0;
    font-size: 15px;
    color: #712275;
    transition: all .6s;
}
.blog_list_le img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.subbox_item a:after {
    content: '';
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 8;
    background: rgb(236 184 249 / 18%);
    opacity: 0;
    border: 0px #ddd solid;
    transition: all .5s;
    border-radius: 10px;
}	
/*side*/
.blog_le .accordion > li:hover,
.blog_le .accordion > li.on_this_category { background:#854189 !important;}
	
/*相簿 ********************************************* */
/*首頁*/
.module_i_album .title_i_box { position: absolute;  z-index: 99;  margin: 0 auto; text-align: center;  display: block;  width: 100%; margin-top: -55px;letter-spacing: 2px;}
.module_i_album .title_i_box:before {
        content: "";  background: #f9f9f9;   position: absolute;  width: 285px;  height: 87px;
        z-index: -1;  left: 50%;  transform: translateX(-50%); top: -10px;}
.module_i_album .title_i_box h6 {  font-size: 30px;  color: #e2b795;  font-weight: 500;  letter-spacing: 2px;}
.module_i_album .title_i_box h4 { font-size: 17px;  color: #e2b795;  font-weight: 500;}

.module_i_album section { width: 100%;  max-width: 100%;}
.i_album_list {  grid-gap: 0vw;}
.i_album_list_box {padding: 0px 0;}
.module_i_album { padding: 0px;}
.i_album_b {  display: none;}

.pageIndex .i_album_list li div {width: 100%;aspect-ratio: unset;  height: 600px;}
.pageIndex .i_album_list li a p {
        background: linear-gradient(to top, #000000, #00000000);   color: #ffffff;  height: 15em;   padding: 0 35px 50px;
        letter-spacing: 5px;  font-size: 17px;  writing-mode: tb;align-items:flex-end;  justify-content: flex-end;}

/*hover*/
.pageIndex .i_album_list li:hover p { height: 100%; justify-content: flex-end;   padding-bottom: 100px;}
.pageIndex .i_album_list li a:before { content: "";
        background: url(https://pic03.eapple.com.tw/urcurtain/search_img.svg);
        width: 30px;  height: 30px; position: absolute;
        left: 39px; bottom: 0%;  z-index: 99; opacity: 0; transition: 0.6s;}

.i_album_list li:hover a:before {  opacity: 1;  bottom: 6%;}
	
/*news*/

.i_blog_b {
    max-width: 1200px;
    margin: auto;
    text-align: center;
    margin-top: 50px;
}	

	
.module_i_news {
    padding: 50px 0 150px 0px;
}
.module_i_news li a:before {
    content: 'READ MORE';
    position: absolute;
    z-index: 19;
    bottom: 10px;
    right: 10px;
    opacity: 0;
    text-align: center;
    font-size: 15px;
    color: #702689;
    transition: all .6s;
}
	
	.module_i_news li a:after {
    content: '';
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 8;
    background: rgb(229 187 255 / 15%);
    opacity: 0;
    border: 0px #ddd solid;
    transition: all .6s;
    border-radius: 10px;
}

*
.i_blog_le img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
	border-radius:10px;
}
.pageIndex.module_i_news li a:after {
    content: '';
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 8;
    background: rgb(222 206 227 / 29%);
    opacity: 0;
    border: 0px #ddd solid;
    transition: all .6s;
    border-radius: 10px;
}
	
.pageIndex.i_blog_le img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}
	
.pageIndex.module_i_news li a:after {
    content: '';
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 8;
    background: rgb(222 206 227 / 29%);
    opacity: 0;
    border: 0px #ddd solid;
    transition: all .6s;
    border-radius: 10px;
}

    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.animated-arrow {
    background: #aa59ab;
    color: #fff;
    display: inline-block;
    margin-top: 20px;
    /* margin-left: auto; */
    height: 50px;
    line-height: 50px;
    overflow: hidden;
    width: 250px;
    /* padding-left: 5%; */
    text-align: center;
    position: relative;
    border-radius: 10px;
}

.module_i_news .title_i_box h4 {
    font-size: 25px;
    color: #5c0c74;
    font-weight: 500;
    display: flex;
    justify-content: center;
    /* padding-top: 10px; */
    align-items: center;
    font-family: Julius Sans none;
}

.module_i_news .title_i_box h4:before {
    content: "NEWS";
    display: flex;
    justify-content: center;
    font-family: Julius Sans One;
    color: #e7ba9a;
    font-size: 39px;
    letter-spacing: 1px;
    margin-bottom: -5px;
    padding-right: 20px;
    /* font-style: italic; */
    padding-bottom: 5px;
    flex-direction: row;
    Julius Sans anchor-name: none;
    font-weight: 800;
}


.animated-arrow {
    background: #aa59ab;
    color: #fff;
    display: inline-block;
    margin-top: 20px;
    /* margin-left: auto; */
    height: 50px;
    line-height: 50px;
    overflow: hidden;
    width: 250px;
    /* padding-left: 5%; */
    text-align: center;
    position: relative;
    border-radius: 10px;
}

/*樣式*/
.i_album_list li a p {
        background: linear-gradient(to top, #000000, #00000000);   color: #ffffff;  height: 9em;
        letter-spacing: 2px;  font-size: 17px; align-items:center;padding-bottom: 20px;}
/* flex-basis: ; */
ul.i_album_list li { flex-grow: 1;box-sizing: border-box;margin: auto 0; display: inline-block;  vertical-align: top;}
.i_album_list li div { aspect-ratio: unset; height: 34vw;}
.i_album_list li:hover img { transform: scale(1.02);}

@media screen and (max-width: 768px) {  .pageIndex .i_album_list li div {height: 350px;}}

/*列表*/
.show-list { grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); grid-gap: 30px;}
.subalbum-menu h2 { color:#111111; letter-spacing: 5px;}
.overlay { display: none !important; }
.other_subalbum li a p { line-height: 2; background: linear-gradient(to top, #000000, #00000000);
    color: #ffffff; height: 4em; letter-spacing: 2px;  font-size: 17px; position: absolute; bottom: 0;  width: 100%;  transition: 0.5s; display: flex;  align-items: center; justify-content: center; align-content: center;}
.other_subalbum li:hover a p {  height: 100%; }

/*內頁*/
.album_info_page .pic-list .item h6 { font-size: 15px; color: #111; padding: 15px 5px;transition: 0.5s;}
.album_info_page .pic-list { grid-gap: 35px 20px;grid-template-columns: repeat(auto-fill, minmax(390px, 1fr));}
.pic-list .item:hover h6 { color: #e2b795;}
h4.blog_category_title { color: #333; border-bottom: 1px #ccc solid; font-size: 25px;padding-bottom: 25px;}

.album_descrip {
        margin-bottom: 50px;color: #444; line-height: 1.8; font-size: 16px;
        letter-spacing: 2px; padding-bottom: 25px; border-bottom: 1px solid #bababa; position: relative;}

.pic-list .show_pic img { transition: 0.5s;}
.pic-list a:hover .show_pic img { transform: scale(1.05);}
.album_a .other_album { display: none;}

/*hover*/
.show-list .item a:before{
    content: ""; background: url(https://pic03.eapple.com.tw/urcurtain/search_img.svg);
    width: 30px; height: 30px; position: absolute; transform: translateX(-50%); left: 50%;  top: 100%;  z-index: 99;  opacity: 0;  transition: 0.6s;}
.show-list .item:hover a:before {  opacity: 1;  top: 63%;}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */
@media screen and (max-width: 1280px) {

.navigation {/* grid-template-columns: 180px 1fr 120px; */display: flex;flex-direction: column;justify-content: center;align-items: center;}
.me_tp_features {width: fit-content;display: none;}
.stellarnav > ul > li > a {margin: 0 3px; letter-spacing: 1px;}
.stellarnav ul {
    text-align:center;
}	
	
}

@media screen and (max-width: 1200px) {
/*footer*/
.footer .center { padding: 0 30px;}
.footer_info li:nth-child(1) { width: 350px;}   
.footer_info { grid-template-columns: 200px 1fr;}   

/*文章*/
/*首頁*/
.module_i_news { padding: 180px 20px 80px;}
.module_i_news section {justify-content: center; }
.module_i_news .title_i_box {text-align: center;}
.module_i_news .title_i_box h4:before { font-size: 30px; top: -45px; left: 50%; transform: translateX(-50%);}
.module_i_news .title_i_box h4:after { left: 50%; transform: translateX(-50%); top: -105px; width: 50px;  height: 50px; }
.module_i_news .title_i_box { margin-bottom: 30px;}
.module_i_news .title_i_box h4 { top: 0px;}
.module_i_news_list { width: 100%;}
.module_i_news section { max-width: 100%; flex-wrap: wrap; align-items: center;}

.i_blog_b { margin: 0 auto;}
.i_blog_b a { margin: 50px auto 0 0;}
.blog_list_ri h5 { font-size: 20px;}
.module_i_news { padding: 180px 20px 0px;}
}


@media screen and (max-width: 1080px) {
/*header*/
.navigation { grid-template-columns: 120px 1fr 120px;}   
.nav-header {max-width: 200px;margin-top: 10px;margin-left: 20px;}

@media screen and (max-width: 1024px) {
.main_part {border-radius: 50px 60px 0px 0px;}    
/*header*/
.stellarnav ul {text-align: center;}
.header_area {/* padding: 10px; *//* position: fixed; */padding: 20px;}
.me_tp_features {display: none;}
/*banner*/
/*
.banner { height: 450px;}
.banner h5:before { top: -35%;font-size: 23px;}
.banner h5:after { font-size: 17px; padding-top: 15px;}

*/
}
@media screen and (max-width: 980px) {
/*footer*/
.footer_info { grid-template-columns: 1fr;grid-gap: 50px;}
.footer_info ul {justify-content: flex-start;}
.footer_info li:nth-child(1) ,.footer_info li:nth-child(2) { width: 50%;}
.footer_info {padding: 0 0px;}

/*相簿*/
.show-list {grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }

/*文章*/
.blog_subbox { grid-template-columns: 1fr;}
}

@media screen and (max-width: 768px) {
/*all*/    
.show_content {  padding: 15px 20px;}    
/*header*/
.stellarnav > ul > li>a:after {display: none;}
.stellarnav > ul > li > a {line-height: 40px; height: 40px;}
.tp_links {display: none;}

/*選單*/




.stellarnav.mobile {/* top: 10px; */}
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu { background: #e1b795;  color: #fff;}
.stellarnav .icon-close:before ,.stellarnav .icon-close:after{ border-bottom: solid 3px #ffffff;}
.stellarnav.mobile li.open { padding: 0px;}
.stellarnav.mobile ul ul li {/* padding-left: 17px; */background: transparent;}

/*大圖*/
/*
.bannerindex .swiper-slide img {  }
.bannerindex .swiper-backface-hidden .swiper-wrapper { width: 100% !important; aspect-ratio: 6 / 7;}
.bannerindex .swiper-slide:nth-child(1).swiper-slide-active { background-image: url(https://pic03.eapple.com.tw/.jpg); background-position: top; background-size:cover;}
.bannerindex .swiper-slide:nth-child(2).swiper-slide-active { background-image: url(https://pic03.eapple.com.tw/.jpg); background-position: top; background-size:cover;}
.bannerindex .swiper-slide.swiper-slide-active:before , .bannerindex .swiper-slide.swiper-slide-active:after {}*/

/* 開啟手機板下方按鈕所需設定 */
#bottom_menu {display: none; }
.footer.with_shopping_mode {/* padding:50px 0 0px; */}
#to_top { bottom:60px;}


/*購物車*/
.product_menu_list,
.products-list,
.product-wrapper { width: 100%;}
.product-layer-two { margin-right: 0; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); grid-gap: 5px;}
.product_page .product-layer-two,
.product_page .products-list { width: 100%; border-right: none;}
.product_page .product_menu_list>h5{display: block;}

.product_page .show_content > a { order: 1;}
.product_page ul.products-list { order: 2;}
.product_page ul.page { order: 3;}
.product_page .product_menu_list {width: 100%; order: 0; min-height: unset;}

/*文章*/
/*首頁*/
.module_i_news .title_i_box { margin-bottom: 40px;}
.module_i_news ul { grid-template-columns: 1fr 1fr; grid-gap: 60px 30px;}
.module_i_news li:nth-child(4) { display: block;}

/*列表*/
.blog_le, .blog_ri { padding: 20px 0 10px; margin-bottom: 0vw; }
.blog_le {width: 100%;}
.blog_ri { width: 100%;}
.i_blog_ri { min-height: 150px;}
h4.blog_category_title { font-size: 20px;}
.blog_subbox { grid-template-columns: 1fr 1fr;}


/*相簿*/
.pageIndex .i_album_list li a p { align-items: flex-end;writing-mode: unset;justify-content: center;padding: 0 35px 30px;}
.pageIndex .i_album_list li a:before {display: none;}
.pageIndex .i_album_list li:hover p {  height: 100%; justify-content: center; padding-bottom: 30px;}
}

@media screen and (max-width: 600px) { 
/*文章*/
.blog_subbox {  grid-template-columns: 1fr;   grid-gap: 40px 20px;}
.blog_back {  width: 100%;grid-template-columns: 1fr;}
.module_i_news ul { grid-template-columns: 1fr;}

/*相簿*/
.album_descrip { line-height: 1.4; font-size: 15px;  letter-spacing: 1px; }
.album_info_page .pic-list { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); grid-gap: 10px 20px;}
.pic-list .show_pic {  aspect-ratio: auto;}

}


/* = = = footer = = = = = = = = = = = = = = = = = = = = = = = = = = = = = */
.footer_info li p.line:before {
    content: '官方Line：';
}
	.footer_info li p.add2:before {
    content: '許可證號：';
}
.footer_logo img {
    max-width: 160%;
}
.footer_logo  {
    background: url(https://pic03.eapple.com.tw//) no-repeat center;
    width: 100%;
    height: 100%;
    margin-top: 50px;
    padding-right: 80px;
}

.footer {
    padding: 30px 0 0;
    font-size: 14px;
    background: #6c2669;
    position: relative;
    z-index: 99;
}



.footer_info {
    padding: 0;
    grid-template-columns: 350px 1fr;
    row-gap: 0;
    column-gap: 90px;
    }
.footer_info ul { 
    display: inline-flex;
    vertical-align: top;
    align-items: center;
    font-family: "Noto San TC", sans-serif;}

/*footer_info*/
.footer_info li:nth-child(1) { display: inline-block; width: 100%; padding: 20px 10px;}
.footer_info li p {color: #ffffff;}
.footer_info li p a { color: inherit;}

/*footer_menu*/
.footer_info li:nth-child(2) { display: inline-block; width: 100%; vertical-align: top;}
.footer_menu { margin-top: 10px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(130px,100%), 1fr)); gap: 5px;}/*footeræŒ‰éˆ•æœ€å°å¯¬åº¦100px*/

.footer_menu a {
    color: #ffffff;
    font-size: 1rem;
    letter-spacing: 0.05em;
    text-decoration: none;
    position: relative;
    display: inline-block;
    transition: transform 0.3s ease-out, color 0.3s ease-out;
    background-color: transparent;
    border: 0;
    z-index: 0;
}

.footer_menu a:hover {
    color: #c9b22a;
    background: transparent;
}

/* 光暈效果 */
.footer_menu a::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 40%;
    width: 0;
    height: 0;
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(0);
    background: radial-gradient(
        circle,
        rgba(255, 255, 255, 0.4) 0%,     
        rgb(216 187 108 / 50%) 40%,   
        rgba(216, 187, 108, 0) 100%
    );
    opacity: 0;
    pointer-events: none;
    z-index: -1;
}

/* 滑鼠移上觸發爆炸光暈 */
.footer_menu a:hover::before {
    animation: burstCircleTiny 0.7s ease-out forwards;
}

/* 小光暈動畫 */
@keyframes burstCircleTiny {
    0% {
        width: 0;
        height: 0;
        opacity: 0.8;
        transform: translate(-50%, -50%) scale(0.1);
    }
    60% {
        width: 70%;
        height: 70%;
        opacity: 0.4;
        transform: translate(-50%, -50%) scale(1);
    }
    100% {
        width: 90%;
        height: 90%;
        opacity: 0;
        transform: translate(-50%, -50%) scale(1.1);
    }
}
.box_link {display: none;}
.box_link a { transition:all 0.3s;}

.box_link a:hover { background: #D1BB9E; border-color: #D1BB9E;}
.box_link a:hover .fa-whatsapp:before, .box_link a:hover .fa-envelope::before, .box_link a:hover .fa-facebook::before, .box_link a:hover .fa-line::before , .box_link a:hover .fa-instagram::before { color: #fff;}


.copy {background: #52175e;color: #fff;border: none;}
.copy a { color: #fff; transition:all 0.3s;}

/*--RWD---------------------------------------*/

@media screen and (max-width: 1024px) {
    .footer_info {display: flex ; flex-wrap: wrap ; align-items: center ; padding: 20px;}
    .footer_menu {margin-top: 10px ; display: grid ; grid-template-columns: repeat(3, 1fr) ; gap: 5px;}
    .footer_info ul {width: 100% ; padding: 0;}
    .footer_info li:nth-child(1) {
        display: grid;
        padding-left: 5%;
        align-content: space-between;
        width: 50%;
    }
}
@media screen and (max-width: 768px) {
    /*footer*/
    .footer_info { justify-content: center;}
    .footer_logo {text-align: center;/* padding-right: 50px; */margin-top: 0px;padding-right
Shorthand property to set values for the thickness of the padding area. If left is omitted, it is the same as right. If bottom is omitted it is the same as top, if right is omitted it is the same as top. The value may not be negative.

Widely available across major browsers (Baseline since January 2018)
Learn more

Don't show: 80px;';padding-right
Shorthand property to set values for the thickness of the padding area. If left is omitted, it is the same as right. If bottom is omitted it is the same as top, if right is omitted it is the same as top. The value may not be negative.

Widely available across major browsers (Baseline since January 2018)
Learn more

Don't show: 80px;';/* padding-right: 50px; */padding-right: 100px;}
    .footer_info ul { flex-direction: column;}
    .footer_info li:nth-child(1) {text-align: left;width: 100%;}
    .footer_info li:nth-child(2) { width: 100%; border-left: none;}

    /*åº•éƒ¨æŒ‰éˆ•*/
    #to_top { bottom:60px;}
    .footer.with_shopping_mode {/* padding:30px 0 70px; */}
}

@media screen and (max-width: 600px) { 
    /*footer*/
    .footer_info ul { width: 100%;}
    .footer_menu{    grid-template-columns: 1fr 1fr;}

    /*è¯çµ¡icon*/
    .box_link { text-align: center;}
}




@media screen and (max-width: 768px) {
	

.main_header_area .container {   max-width: 100%;}

	.header_area.sticky {
	 backdrop-filter: unset;
	 /* position: static; */
	 /* margin-top: 20px; */
}

.header_area:after {
    content: "";
    position: absolute;
    display: block;
    width: 0%;
    height: 3px;
    background: linear-gradient(45deg, #5f1083, #fec9ff);
    transform: translate(-50px, 20px);
    transition: .5s;}
.header_area.sticky:after {
    width: 110%;
    transition: .5s;
}

/*側邊選單/＝＝＝＝＝*/
/*menu*/
.stellarnav .menu-toggle {/* padding: 15px 10px; */padding-top: -3px;margin-top: -2px;}
.stellarnav .menu-toggle:after {color: #f9de94;}
.stellarnav .menu-toggle span.bars span {background: #f5daa0;}

/*close*/
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu {background: transparent;color: #b2984b;}
.stellarnav a { color: #d6b349;}
.stellarnav .icon-close:before, .stellarnav .icon-close:after {border-bottom: solid 2px #a88b44;}


/*背景色*/
.stellarnav.mobile ul {background: #ffffffb5;backdrop-filter: saturate(93%) blur(4px);}
/*第一層*/
.stellarnav li li > a , .stellarnav li li.has-sub > a{padding: 10px;border-left:none;margin: 0;}
.stellarnav li li:hover > a , .stellarnav li li.has-sub:hover > a{padding: 10px;border-color:transparent;background: #0081c700;color: white;}
.stellarnav.mobile > ul > li {border-bottom: 0px #cdcdcd00 dashed;}

/*第二層*/
.stellarnav.mobile li.open{ background: transparent;}
.stellarnav ul ul {   margin: 0 15px 15px;}

.stellarnav li li > a, .stellarnav li li.has-sub > a {background: transparent;color: #9d8824;border-radius:5px;}
.stellarnav li li:hover > a, .stellarnav li li.has-sub:hover > a {background: rgb(183 159 87);color: #ffffff;}
.stellarnav li li {border: 0px #4d9dd200 solid;background: #ffffff00;}


.stellarnav>ul>li::before {display:none;}

.stellarnav.mobile > ul > li > a {
        text-align: left;
        overflow: auto;
        height: auto;
        line-height: 150%;
        display: block;
        color: #9f7b32;
    }
.stellarnav.mobile li.open li.open {
    background: #927b40;
    padding: 3px;
}


.stellarnav>ul>li>ul>li>ul>li>a {
    background: #b59736;
    padding-left: 16px;
    color: #ffffff;
    transition: all 0.5s;
}

.stellarnav>ul>li>ul>li>a::before{  display:none;}

.stellarnav>ul>li>ul>li>ul>li>a:hover {
    background: #dec268;
    padding-left: 16px;
    color: #ffffff;
    transition: all 0.5s;
}
	.stellarnav ul ul {
    background: #af9d33d6;
    backdrop-filter: blur(10px);
    left: 0;
    box-shadow: 0 3px 8px rgb(255 255 255 / 0%);
    
    margin-top: 5%;
    width: 200px;
}
.stellarnav.mobile li li.has-sub a {
    /* padding: 0px; */
}
	
/*+*/
.stellarnav a.dd-toggle .icon-plus:before, .stellarnav a.dd-toggle .icon-plus:after {border-bottom: solid 2px #a88b44;}
.stellarnav.mobile > ul > li > a.dd-toggle {background: transparent;/* color: #1fb5df; */}
stellarnav.mobile li li a.dd-toggle {
    padding: 0;
    background: transparent;
}
	

}
	