@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Klee+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@200..900&display=swap');

/*
關於CSS設定說明
CSS屬性是會繼承的，而且還是由上往下繼承。
同樣元素設定16px 後 12px 再 15px 最後會以最後設定的15px為準
但是有兩種情況除外:
1.絕對路徑命名. 如: .xx .yy .zz p {設定值;}
2.important.  如: .xx p {設定值 !important;}

CSS3選取器語法 :nth-child(n) 

*/
body{
    font-family: "Klee One","Noto Serif TC", cursive;
}
.path p, .path p a{ display: none;}

.edit{ padding: 0px 0; color: #000;} 
.info_fix{ display: none;}

#page{ background: #eae1d2;}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/* scrollbar */
body{
    overflow: overlay;
}
&::-webkit-scrollbar {
    background: #f6f4ea;
    width: 7px;
}
&::-webkit-scrollbar-button {
    display: none;
    background: #f6f4ea;
    border-radius: 0;
  }
&::-webkit-scrollbar-track-piece {
    background: #f6f4ea;
  }

&::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: #a59280;
    border: 1px solid #f6f4ea;
  }

&::-webkit-scrollbar-track {
    box-shadow: transparent;
  }



/* banner進場 */
.swiper-banner{
    animation: bannerZoomIn 2.5s ease-out forwards;
    animation-delay: 2.5s;
    opacity: 0;
}
@keyframes bannerZoomIn {
    0% {
        opacity: 0;
        transform: scale(1.3);
    }
    50% {
        opacity: 1;
        transform: scale(1.2);
    }
    100%{
        opacity: 1;
        transform: scale(1);
    }
}


.bannerindex{position: relative;}


.bannerindex::after {
    content: "";
    display: block;
    /* background-image: url(https://pic03.eapple.com.tw/rachel/r-logo.png); */
    background-size: cover;
    width: 250px;
    height: 250px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: fixed;
    top: 40%;
    left: 43%;
    transform: translate(-50%, -50%);
    z-index: 1000000000000000000001;
    pointer-events: none;
    animation: swapImage 3.5s forwards, banner-logo 3.5s forwards;
}

@keyframes swapImage {
    0% {
      background-image: url(https://pic03.eapple.com.tw/rachel/r-logo.png);
      filter: brightness(1);
    }
    50% {
      background-image: url(https://pic03.eapple.com.tw/rachel/r-logo.png); /* 可加旋轉縮放等過渡 */
      transform: rotateY(90deg);
      filter: brightness(1.3);
    }
    51% {
      background-image: url(https://pic03.eapple.com.tw/rachel/logo.png);
      transform: rotateY(270deg);
    }
    100% {
      background-image: url(https://pic03.eapple.com.tw/rachel/logo.png);
      transform: rotateY(360deg);
      filter: brightness(1);
    }
  }

.bannerindex::before {
    content: "";
    display: block;
    background: #f4eee6;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 1000000000000000000000;
    animation: banner-bg 3.5s forwards;

}


.swiper-banner::after {
    content: "";
    display: block;
    height: 0px;
    background-color: transparent;
    pointer-events: none;
    position: fixed;
    bottom: 240px;
    z-index: 500;
    opacity: 0;
}

@keyframes banner-logo {
    0% {
        opacity: 0;
        filter: blur(0);
    }

    25% {
        opacity: 1;
        filter: blur(0);
    }

    50% {
        filter: blur(0);
        opacity: 1;
    }

    80% {
        filter: blur(0);
        opacity: 1;
    }

    100% {
        filter: blur(10);
        opacity: 0;

    }
}

@keyframes glow {
    0%, 100% {
      filter: brightness(1);
    }
    50% {
      filter: brightness(1.3);
    }
}

@keyframes banner-bg {
    0% {}

    50% {}

    80% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}


@media screen and (max-width:1380px) {
    .bannerindex::after {
        top: 34%;
        left: 41%;
    }
}
@media screen and (max-width:1024px) {
    .bannerindex::after {
        top: 36%;
        left: 38%;
    }
}
@media screen and (max-width:768px) {
    .bannerindex::after {
        top: 33%;
        left: 33%;
    }
}
@media screen and (max-width:600px) {
    .bannerindex::after {
        top: 35%;
        left: 28%;
    }
}
@media screen and (max-width:450px) {
    .bannerindex::after {
        width: 220px;
        height: 130px;
         top: 42%;
        left: 26%;
    }
}
@media screen and (max-width:410px) {
    .bannerindex::after {
        top: 40%;
        left: 22%;
    }
}
@media screen and (max-width:380px) {
    .bannerindex::after {
        left: 21%;
    }
}



/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*大圖*/
#content_main {  margin: 0;}
.bannerindex { position: static; height: auto;}
.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;}
.swiper-banner .swiper-slide:after {content: ""; position: absolute;  z-index: 999; pointer-events: none;}


.swiper-wrapper .swiper-slide:before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: -99px;
    background-image: url(https://pic03.eapple.com.tw/rachel/b-bgshadow.png);
    width: 100%;
    max-width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 10000;
    animation: floatShadow 30s infinite cubic-bezier(0.65, 0.01, 0.28, 0.94);
    
}

@keyframes floatShadow {
    0%,100%{
        transform: scale(1.2) rotateZ(0deg) translate(0px,0);
    }
    50%{
        transform: scale(1.3) rotateZ(2deg) translate(-100px,0);
    }

}


.swiper-banner .swiper-slide:nth-child(1):after   {
    background: url(https://pic03.eapple.com.tw/rachel/banner01.svg);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0px;
    right: 0%;
    width: 103% !important;
    height: 100% !important;
    background-position: right;
    padding-bottom: calc(99% / 1* 0.25);
}

.swiper-banner .swiper-slide:nth-child(2):after {
    background: url(https://pic03.eapple.com.tw/rachel/banner02.svg);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0px;
    right: 0%;
    width: 103% !important;
    height: 100% !important;
    background-position: right;
    padding-bottom: calc(99% / 1* 0.25);
}

@media screen and (max-width: 600px){
    .bannerindex .swiper-slide img { display:none; }
    .bannerindex .swiper-slide {height: 116vw;  width: 100% !important; }/*圖片比例*/
    .bannerindex .swiper-slide:nth-child(1) { background-image: url(https://pic03.eapple.com.tw/rachel/ban-rwd1.jpg); background-position: top; background-size:cover;}/*個別換背景*/
    .bannerindex .swiper-slide:nth-child(2) { background-image: url(https://pic03.eapple.com.tw/rachel/ban-rwd2.jpg); background-position: top; background-size:cover;}


    .swiper-banner .swiper-slide:nth-child(1):after   {
        background: url(https://pic03.eapple.com.tw/rachel/ban-rwd01.svg);
        background-size: contain;
        background-repeat: no-repeat;
        top: -5px;
        right: 0%;
        width: 101% !important;
        height: 101% !important;
        background-position: right;
        padding-bottom: calc(100% / 1* 0.25);
    }
    
    .swiper-banner .swiper-slide:nth-child(2):after {
        background: url(https://pic03.eapple.com.tw/rachel/ban-rwd02.svg);
        background-size: contain;
        background-repeat: no-repeat;
        top: -5px;
        right: 0%;
        width: 101% !important;
        height: 101% !important;
        background-position: right;
        padding-bottom: calc(100% / 1* 0.25);
    }

}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


.fix_ri ,.pageIndex #content_main,.pageIndex .footer{opacity: 0;  
    animation: show 1.5s ease-in-out forwards;
    animation-delay: 3.5s; }


/*HEADER*/
.header_area { padding: 20px 0 0;background: unset;position: fixed;transition: 0.5s ease;}
.main_header_area .container { max-width: 98%;}
.pageIndex .navigation{
    opacity: 0;  
    animation: show 1.5s ease-in-out forwards;
    animation-delay: 3.5s;
}
.navigation {grid-template-columns: 230px 360px 1fr;grid-gap: 0;align-items: center; 
}
.me_tp_features { text-align: left; margin-top: -13px; margin-left: 32px;}
.header_area.sticky .me_tp_features a{ color: #fff;}
.me_tp_features a:hover{ color: #d7b69a;}
.tp_links{ display: none; }
.shop_search_btn{ background: #897668 ;}
.me_tp_features a.tp_btn_cart span span { display: none;}
.me_tp_features a.tp_btn_notice span { display: none;}

.header_area.sticky {background: unset;}
.header_area:before {content: '';display: block;position: absolute;top: -80px;left: 0;width: 100%;height: 86px;
    background: #b79378;opacity: 0;transition: 1s ease; }
.header_area.sticky:before {top: 0px;opacity: 1;transition: 1s cubic-bezier(0.8, 0.1, 0.1, 0.84); }
.header_area.sticky .nav-header {max-width: 190px; margin-top: -10px;}
.header_area.sticky .nav-brand{filter:brightness(15) ;  }

/*LOGO*/
.nav-header {max-width: 230px;grid-row: 1 / 1;transition: 0.5s ease;}
.nav-brand {display: flex;}

/*電腦版選單--換成手機版*/
.stellarnav .menu-toggle {display: flex;flex-direction: column;align-items: center;z-index: 1;transition: 1s ease; margin-top: -13px;}
.stellarnav .menu-toggle span.bars {display: flex;top: 0;flex-direction: column;align-items: center;justify-content: center;}
.stellarnav .menu-toggle span.bars span {width: 42px;height: 2px;background: #303030;margin: 3px auto;
    opacity: 1;border-radius: 0;transform: rotate(0deg) translateX(8px);transition: transform 1s ease, opacity 1s ease;}
.stellarnav .menu-toggle span.bars span:hover{  -webkit-transform: rotate(180deg);
    transform: rotate(180deg);}
.stellarnav .menu-toggle span.bars span:nth-of-type(2) {width: 0px;}
.stellarnav .menu-toggle span.bars span:nth-of-type(3) { width: 32px; margin-left: 0px;}
.header_area.sticky .stellarnav .menu-toggle span.bars span{ background: #fff;}
.stellarnav.left.desktop.active .menu-toggle span.bars span:nth-of-type(1) {transform: rotate(20deg) translate3d(10px, 5px, 0px);}
.stellarnav.left.desktop.active .menu-toggle span.bars span:nth-of-type(2) {opacity: 0;transition: opacity 1s ease;}
.stellarnav.left.desktop.active .menu-toggle span.bars span:nth-of-type(3) {transform: rotate(-20deg) translate3d(10px, -5px, 0px); width: 42px; }

.stellarnav .menu-toggle:after {display: none;}
.stellarnav ul > li > ul > li {display: none !important;}

/*開啟MENU*/
.stellarnav {display: flex;flex-direction: row-reverse;align-items: center;gap: 30px;}
.stellarnav ul {opacity: 0;}
.stellarnav.left.desktop.active > ul {display: block !important;opacity: 1;}


.stellarnav.left.desktop > ul > li {opacity: 0;-webkit-transform: translateX(50px);transform: translateX(50px);visibility: visible;
    -webkit-transition: opacity 0.5s ease 0s, -webkit-transform 0.5s ease 0s;
    transition: opacity 0.5s ease 0s, -webkit-transform 0.5s ease 0s;
    transition: opacity 0.5s ease 0s, transform 0.5s ease 0s;
    transition: opacity 0.5s ease 0s, transform 0.5s ease 0s, -webkit-transform 0.5s ease 0s;}
.stellarnav.left.desktop.active > ul > li {opacity: 1;-webkit-transform: translateX(0px);transform: translateX(0px);
    -webkit-transition: opacity 0.5s ease 0s, -webkit-transform 0.5s ease 0s;
    transition: opacity 0.5s ease 0s, -webkit-transform 0.5s ease 0s;
    transition: opacity 0.5s ease 0s, transform 0.5s ease 0s;
    transition: opacity 0.5s ease 0s, transform 0.5s ease 0s, -webkit-transform 0.5s ease 0s;}

/*-----------每一顆按鈕的延遲出現-----------*/
.stellarnav.left.desktop.active > ul > li {
    -webkit-transition: opacity 0.2s ease 0.5s, -webkit-transform 0.2s ease 0.5s;
    transition: opacity 0.2s ease 0.5s, -webkit-transform 0.2s ease 0.5s;
    transition: opacity 0.2s ease 0.5s, transform 0.2s ease 0.5s;
    transition: opacity 0.2s ease 0.5s, transform 0.2s ease 0.5s, -webkit-transform 0.2s ease 0.5s;}

/* .stellarnav.left.desktop.active > ul > li:nth-of-type(2) {
    -webkit-transition: opacity 0.5s ease 0.9s, -webkit-transform 0.5s ease 0.9s;
    transition: opacity 0.5s ease 0.9s, -webkit-transform 0.5s ease 0.9s;
    transition: opacity 0.5s ease 0.9s, transform 0.5s ease 0.9s;
    transition: opacity 0.5s ease 0.9s, transform 0.5s ease 0.9s, -webkit-transform 0.5s ease 0.9s;}
.stellarnav.left.desktop.active > ul > li:nth-of-type(3) {
    -webkit-transition: opacity 0.5s ease 0.75s, -webkit-transform 0.5s ease 0.75s;
    transition: opacity 0.5s ease 0.75s, -webkit-transform 0.5s ease 0.75s;
    transition: opacity 0.5s ease 0.75s, transform 0.5s ease 0.75s;
    transition: opacity 0.5s ease 0.75s, transform 0.5s ease 0.75s, -webkit-transform 0.5s ease 0.75s;}
.stellarnav.left.desktop.active > ul > li:nth-of-type(4) {
    -webkit-transition: opacity 0.5s ease 0.6s, -webkit-transform 0.5s ease 0.6s;
    transition: opacity 0.5s ease 0.6s, -webkit-transform 0.5s ease 0.6s;
    transition: opacity 0.5s ease 0.6s, transform 0.5s ease 0.6s;
    transition: opacity 0.5s ease 0.6s, transform 0.5s ease 0.6s, -webkit-transform 0.5s ease 0.6s;}
.stellarnav.left.desktop.active > ul > li:nth-of-type(5) {
    -webkit-transition: opacity 0.5s ease 0.45s, -webkit-transform 0.5s ease 0.45s;
    transition: opacity 0.5s ease 0.45s, -webkit-transform 0.5s ease 0.45s;
    transition: opacity 0.5s ease 0.45s, transform 0.5s ease 0.45s;
    transition: opacity 0.5s ease 0.45s, transform 0.5s ease 0.45s, -webkit-transform 0.5s ease 0.45s;}
.stellarnav.left.desktop.active > ul > li:nth-of-type(6) {
    -webkit-transition: opacity 0.5s ease 0.3s, -webkit-transform 0.5s ease 0.3s;
    transition: opacity 0.5s ease 0.3s, -webkit-transform 0.5s ease 0.3s;
    transition: opacity 0.5s ease 0.3s, transform 0.5s ease 0.3s;
    transition: opacity 0.5s ease 0.3s, transform 0.5s ease 0.3s, -webkit-transform 0.5s ease 0.3s;}
.stellarnav.left.desktop.active > ul > li:nth-of-type(6) {    
    -webkit-transition: opacity 0.5s ease 0.15s, -webkit-transform 0.5s ease 0.15s;
    transition: opacity 0.5s ease 0.15s, -webkit-transform 0.5s ease 0.15s;
    transition: opacity 0.5s ease 0.15s, transform 0.5s ease 0.15s;
    transition: opacity 0.5s ease 0.15s, transform 0.5s ease 0.15s, -webkit-transform 0.5s ease 0.15s;} */
/*-----------每一顆按鈕的延遲出現-----------*/

.stellarnav > ul > li > a, .stellarnav > ul > li.has-sub > a {padding: 0 10px;color: #303030;letter-spacing: 0.15em;
    line-height: 1; margin: 0;height: 30px;transition: 0.5s ease; font-size: 16px;}
.header_area.sticky .stellarnav > ul > li > a,.header_area.sticky .stellarnav > ul > li.has-sub > a{ color: #fff;}
.stellarnav > ul > li > a b {line-height: 35px;height: 35px;}
.stellarnav > ul > li > a:hover {transform: translateY(-5px);-webkit-transform: translateY(-5px);-moz-transform: translateY(-5px); color:#d7b69a; }
.header_area.sticky .stellarnav > ul > li > a:hover {transform: translateY(-5px);-webkit-transform: translateY(-5px);-moz-transform: translateY(-5px); color:#d7b69a; }
.stellarnav li.has-sub > a:after {display: none;}



@keyframes show {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }

@media screen and (max-width:1458px) {
    .navigation{
        grid-template-columns:200px 280px 1fr;
    }
    .me_tp_features{ margin-left: 15px;}
}

@media screen and (max-width:1400px) {
    .stellarnav > ul > li > a, .stellarnav > ul > li.has-sub > a{ font-size: 15px;}
}
@media screen and (max-width:1309px) {
    .box_search{ width: 139px;}
     .navigation{
        grid-template-columns:170px 238px 1fr;
    }
}
@media screen and (max-width:1237px) {
    .stellarnav > ul > li > a, .stellarnav > ul > li.has-sub > a{ letter-spacing: 0em;}
    .stellarnav > ul > li > a, .stellarnav > ul > li.has-sub > a{ padding: 6px 8px 0px;}
}
/* 
/*  */
@media screen and (max-width:1024px) {
.header_area {background: transparent;position: sticky;padding: 15px 0;}
.header_area:before {height: 69px;top: -60px}
.main_header_area .container {max-width: 100%;}
.navigation {display: flex;justify-content: center;align-items: center;flex-direction: row;z-index: 1;}

.stellarnav {position: fixed;width: 0%;height: 100%;top: 24px;right: 0;display: flex;gap: 30px;flex-direction: column;align-items: flex-end;}
.stellarnav.left.desktop.active {width: 50%;}
.stellarnav .menu-toggle {display: block;padding: 0;position: relative;top: 20px;right: 50px;}
.stellarnav.left.desktop >  ul, .stellarnav.left.desktop.active >  ul {display: flex !important;opacity: 0;width: 100%;height: 100%;
    -webkit-transform: translateX(100%);transform: translateX(100%);visibility: visible;transition: opacity .4s, transform .4s;flex-direction: column;
    align-items: center;justify-content: center;background: #b79378f7;gap: 30px;}
.stellarnav.left.desktop.active >  ul {opacity: 1;-webkit-transform: translateX(0%);transform: translateX(0%);}
.stellarnav.left.desktop > ul > li {-webkit-transform: translateX(0px);transform: translateX(0px);}
.stellarnav > ul > li > a, .stellarnav > ul > li.has-sub > a {display: flex;flex-direction: row;align-items: baseline;gap: 15px;padding: 0; font-size: 16px; color: #fff;}
.stellarnav.desktop li.has-sub > a.dd-toggle {display: none;}
.stellarnav > ul > li > a b {min-width: 90px;text-align: left;}
.stellarnav > ul > li > a b:nth-of-type(2) {font-size: 13px;}
.nav-header{ max-width: 180px;}
.header_area.sticky .nav-header{ max-width: 160px;}
.header_area.sticky .stellarnav{ top: 17px;}
.me_tp_features{ margin-top: -6px;}
.stellarnav > ul > li > a, .stellarnav > ul > li.has-sub > a{ letter-spacing: 0.15em;}
}

@media screen and (max-width:768px) {
.nav-header {max-width: 150px;}
.stellarnav {position: fixed;width: 50%;height: 100%;top: 0;right: 0;display: flex;gap: 30px;flex-direction: column;align-items: flex-end;}
.stellarnav.mobile {display: flex;align-items: center;justify-content: center;width: fit-content;left: auto;right: 30px;}
.stellarnav .menu-toggle {top: 0;right: 8px;}
.stellarnav.mobile.left > ul {left: auto;right: 0;display: flex !important;opacity: 0;width: 100%;max-width: 100%;height: 100%;
    -webkit-transform: translateX(100%);transform: translateX(100%);visibility: visible;transition: opacity 1s, transform 1s;flex-direction: column;
    align-items: center;justify-content: center;background: #b79378f7;gap: 30px;z-index: 0;}
.stellarnav.mobile.active.left > ul {opacity: 1;-webkit-transform: translateX(0%);transform: translateX(0%);transition: opacity 1s, transform 1s;}
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu {display: none;}
.stellarnav.mobile.active .menu-toggle span.bars span:nth-of-type(1) {transform: rotate(20deg) translate3d(6px, 6px, 0px);}
.stellarnav.mobile.active .menu-toggle span.bars span:nth-of-type(2) {opacity: 0;transition: opacity 1s ease;}
.stellarnav.mobile.active .menu-toggle span.bars span:nth-of-type(3) {transform: rotate(-20deg) translate3d(10px, -5px, 0px);}
.stellarnav.mobile > ul > li, .stellarnav.mobile > ul > li > a {display: flex;flex-wrap: wrap;justify-content: center;border-bottom: unset;padding: 0;}
.stellarnav > ul > li > a b {min-width: 100px;}
.stellarnav ul > li > ul > li {display: flex !important;border: unset;}
.stellarnav.mobile > ul > li > ul {display: flex !important;width: 100%;max-width: 205px;background: unset;flex-direction: column;
    gap: 10px;margin: 10px 0; text-align: center;}
.stellarnav.mobile > ul > li > ul > li > a {width: 100%;padding: 0;border: unset;font-size: 15px;letter-spacing: 0.15em;height: auto;color: #ece3d4; text-align: center;}
.stellarnav.mobile > ul > li > a.dd-toggle {display: none;}
.me_tp_features a.tp_btn_cart,.me_tp_features a.tp_btn_notice{ display: none;}
.header_area.sticky .stellarnav{ top: 5px;}
}
@media screen and (max-width:600px) {

.header_area:before {height: 64px;top: -50px;}
.stellarnav.mobile {top: -2px;}
.stellarnav.mobile.active .menu-toggle span.bars span:nth-of-type(1) {transform: rotate(20deg) translate3d(5px, 6px, 0px);}
.stellarnav.mobile > ul > li, .stellarnav.mobile > ul > li > a {font-size: 15px;gap: 0;}
.stellarnav > ul > li > a b:nth-of-type(2) {font-size: 12px;}
.stellarnav.mobile > ul > li > ul {max-width: 190px;}
.header_area.sticky .nav-header{ max-width: 140px;}
}
@media screen and (max-width:380px) {
    .box_search{ display: none;}
    .stellarnav.mobile{ top: 5px;}
}

/* 商品下拉超過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;}
/* 主分類超過30個但次分類直接顯示 
.stellarnav.desktop li.bigMenu>ul{grid-gap: 10px;}
.stellarnav.desktop li.bigMenu li{border: 0;}
.stellarnav.desktop li.bigMenu>ul>li>a{border: 1px solid #ddd;}
.stellarnav.desktop li.bigMenu ul ul{display: block !important; position: relative; top: 0; background: unset; border: 0;}
.stellarnav.desktop li.bigMenu ul ul li{border: 0;}
 主分類超過30個但次分類直接顯示-結束 */

/* 商品下拉超過30個--結束 */

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */




/*footer*/
.footer { background: transparent; padding: 60px 0 0; background-image: url(https://pic03.eapple.com.tw/rachel/footer-bg.png); background-size: cover; background-position: top center;   animation: show 1.5s ease-in-out forwards;
    animation-delay: 3.5s; opacity: ;}
.footer_info {  grid-template-columns: 1fr;  padding-right: 0px;  justify-content: center;  justify-items: center;}
.footer_logo{ max-width: 200px;}
.box_link {display: none; }


.footer_info ul:before{
    content: "";
    display: block;
    max-width: 135px;
    height: 189px;
    background-image: url(https://pic03.eapple.com.tw/rachel/f-pic.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position-y: center;
    -webkit-animation: ripple2 35s linear infinite;
    animation: ripple2 35s linear infinite;
    position: relative;
    bottom: 105px;
    right: 86px;
    animation: bloom 3s ease-in-out infinite alternate;
}

@keyframes bloom {
    0% {
      transform: translateY(20px) scale(0.8);
      opacity: 0;
    }
    100% {
      transform: translateY(0) scale(1.2);
      opacity: 1;
    }
  }
  
/*聯絡資訊*/
.footer_info li:nth-child(1) { display: flex; flex-direction: row;  flex-wrap: wrap;  width: 100%;  max-width: 850px; justify-content: center;padding-bottom: 0px; text-align: center; margin-top: -195px;}
.footer_info ul {  width: auto; position: relative;}
.footer_info li p { font-size: 15px;; color: #231815;width: 100%; font-weight: 500;}
.footer_info li p a { color: #231815;}
.footer_info li p.phone {display: none;}

/*選單*/
.footer_info li:nth-child(2) {  text-align: center;  border-top: 0px; padding-top: 20px;}
.footer_menu a:nth-of-type(1) { display: none;}/*首頁不顯示*/
.footer_menu a { width: 22%; padding: 5px 6px;  border: unset;  margin: 0 4px 4px 0; color: #b89b88;  background: transparent;  transition: transform 0.3s ease-in-out;}
.footer_menu a:hover { background: transparent; color: #d7b69a; transition: 0.5s;  transform: scale(1.1) rotate(15deg); font-weight: 500;}

.copy { color: #a3a3a3; border-top: unset; background: transparent;letter-spacing: 2px;}
.copy a { color: #a3a3a3;}

@media screen and (max-width:1024px) {
    .footer_info ul:before{
        max-width: 83px;
        height: 120px;
        right: -47px;
        bottom: 66px;
    }
    .footer_info li:nth-child(1){ margin-top: -122px;}
}

@media screen and (max-width:768px) {
    .footer_menu a{  width: 29%;  }
    .footer_info li p{ width: 100%; text-align: center;}
    .footer_info{ padding: 0 0px;}
}

@media screen and (max-width:660px) {
    .footer_info ul:before{ right: -14px;}
}

@media screen and (max-width:550px) {
    .footer_logo{ max-width: 170px;}
    .footer_info li:nth-child(1){ margin-top: -110px;}
}

@media screen and (max-width:400px) {
    .footer_info ul:before{ display: none; }
    .footer_info li:nth-child(1){ margin-top: 0px;}
}



/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */



.product_page #content, .product_info_page #content ,.car_page #content{ 
        background-image: url(https://pic03.eapple.com.tw/rachel/in-bg.jpg); 
    background-position: top;
    background-size: cover;
    background-repeat: repeat;
}

.product_page .main_part {max-width: 1700px;}
/* 左邊選單 */
/* .product-layer-two > li{ border-bottom: 1px solid rgba(103, 107, 114, 0.5);} */
.product_menu_list ul{ display: grid; grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr; grid-gap: 20px; margin-bottom: 50px;}
.product-layer-two > li:last-child{ border-bottom: 0px;}
.product-layer-two li a{ background: #b79378; color: #fff;  padding: 12px 16px; transition: 0.3s; border: 0px; border-radius: 50px; text-align: center; font-weight: bold;}
.product-layer-two li a:hover{ background: #d7b69a ; color: #fff;}
.product-layer-two li li a{ color: #000; background: unset; }
.product-layer-two li i{ color: #fae5ea; } 
.product-layer-two li.active a{ background: #d7b69a ; border: 0px; color: #fff ;}


/* 商品 */
.products-list{grid-template-columns:1fr 1fr 1fr 1fr ; grid-gap: 40px 20px ;}
.products-list .price { text-align: center; }
.products-list .price b {color: #d5b498;}
.products-list .name{ font-size: 20px; color: #877668; font-weight: bold; text-align: center; height: 2em;
    /* height: 68px; */
}
.products-list .item {border: 1px solid #ddd2c8; padding: 18px;transform: translate(0,0px); transition: 0.3s;}
.products-list .item:hover{ transform: translate(0,-13px);}
.products-list .item a{ transition: 0.3s;}
.products-list .more{ font-size: 15px; color: #fff; border: 0px; font-weight: 300; }
.products-list .item a:hover .more{ background: transparent; font-weight: bold; }
.products-list .pic img{ width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.5s;
}

    .products-list .pic{ overflow: hidden;}
.products-list .item a:hover img  {
    border-radius: 12px;
    background: rgba(165,187,116,.2);
    z-index: 999;
    opacity: 0.8;
}



/* hover圈圈 */
.products-list .item a::after{
    content: "VIEW";
  width: 210px;
  height: 210px;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -100%);
  opacity: 0;
  z-index: 999999999;
  position: absolute;
  border:1px solid #877668;
  color: #877668;
  border-radius: 99em;
  transition: 0.6s;
  pointer-events: none;
}
.products-list .item a:hover::after{
    transform: translate(-50%, -84%);
  opacity: 1;
}
.products-list .pic:before {
    content: "";
    background: rgba(195,164,128,0);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    transition: .3s;
    overflow:hidden;
}

.products-list .item a:hover .pic:before {
    background: rgba(255,255,255,0.9);
    filter: blur(80px);
    z-index: 99999;
}

/* 內頁 */
.product_info_page #content .swiper-slide:nth-child(1):before,.product_info_page #content .swiper-slide:nth-child(2):before{ display: none;}
.sidebarBtn h2{ color: #6a4e3c; font-size: 28px;}
.proImgSwiper img{height: 100%;width: 100%;object-fit: cover;overflow: hidden;}
.pd_tabTitle li.activeTab a{ color: #6d7980; font-size: 24px; font-weight: bold;}

.pd_tabTitle li.activeTab::after{ height: 0px; background: #E4E4E4;}
.sidebarBtn{ border: 1px #ddd solid;}
.inquiry_a1,.inquiry_a2,.inquiry_a3{ background: #877668; border-radius: 50px;}
.inquiry_a1:hover,.inquiry_a2:hover ,.inquiry_a3:hover  { background: #d7b69a;  border-radius: 50px;}


.rewrite_simple{ background: transparent; border-radius: 50px; color: #d7b69a; border: 1px solid #d7b69a!important;}
.send_simple{ background: #d7b69a; border-radius: 50px;}

.product_info_page .edit { text-align: center;}

/* 相關推薦 */
.prod_related h6 span:before{  color: #6d7980; font-size: 24px; font-weight: bold; display: none;}
.prod_related{ background: transparent; padding: 80px 15px 60px;}
.related_list li a{ background: transparent;}
.related_list li a:hover img {
    opacity: 0.75;
    transition: 0.5s;
}
.lastPage{ background: #9ECFBC; border-radius: 8px;}
.sidebarBtn .sp_price{ color: #d5b498;}


/* car page */
.formbox_form li .form__label{ color: #000;}
.separate_title{ background: #a3908029;}
.declaration{background: #a3908029; }
.border200{
    border: 1px solid #a3978d8f ;border-radius: 50px;background: transparent;padding: 10px;
}
.total_amount ul{ border: 1px solid #aeaeae;}

@media screen and (max-width:1529px) {
    .products-list .name{ font-size: 16px; margin-bottom: 10px; height: 30px;}
    .products-list .price b{ font-size: 14px;}
}


@media screen and (max-width:1250px) {
    .products-list .item a:hover::after{
        transform:  translate(-50%, -88%);
    }
    .products-list .item a::after{ width: 170px; height: 170px;}
}


@media screen and (max-width:1024px) {
    .products-list{grid-template-columns:1fr 1fr 1fr ;}
    .product_menu_list ul{ grid-template-columns:1fr 1fr 1fr 1fr 1fr;}
}
@media screen and (max-width:930px) {
    .products-list{grid-template-columns:1fr 1fr;}
    .product_menu_list ul{ grid-template-columns:1fr 1fr 1fr 1fr;}
}

@media screen and (max-width:768px) {
     .product_menu_list ul{ grid-template-columns:1fr 1fr 1fr;}
    .product_page .product_menu_list>h5{ display: none;}
    .product_info_page #content .main_part{ padding:80px 20px 0px;}
    .mobile_product_name{ display: none;}
    .products-list .price b{ text-align: center!important;}
}
@media screen and (max-width:500px) {
     .product_menu_list ul{ grid-template-columns:1fr 1fr;}
     .products-list .item a:after{ width: 140px; height: 140px; }
     .products-list .item a:hover:after{ transform: translate(-50%, -100%); }
}
@media screen and (max-width:420px) {
        .products-list{grid-template-columns:1fr; gap: 24px;}
}


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*預設解除背景輪播*/
#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: 1024px) {
.bannerindex { margin-top: -117px; }
}
@media screen and (max-width: 768px) {
.bannerindex { padding:0; margin:0; margin-top: -88px; }
}


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*內頁BANNER 設定*/
.banner {
    background: #eae1d2;
    background-image: url(https://pic03.eapple.com.tw/rachel/banC.png);
    background-size: contain;
    background-repeat: no-repeat;
    /* min-height: 1050px; */
    padding: 1000px 0px 200px;
    position: relative;
}
.banner:before {
    position: absolute;
    content: "";
    width: 414px;
    height: 504px;
    transform: translate(-50%, -50%);
    left: 57%;
    top: 11%;
    /* border-radius: 50%; */
    /* border: 2px dotted #fac02ca3; */
    background-color: #ffffff66;
    background: url(https://pic03.eapple.com.tw/rachel/ban-fly.png) no-repeat;
    background-size: contain;
    z-index: 0;
    animation: float 2s ease-in-out infinite;
}

@keyframes float {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}

/* .banner:after{
    content: "Contact Us";
    display: block;
    font-size: 300px;
    font-family: "Klee One","Noto Serif TC", cursive;
    color: rgba(222, 208, 189, 0.5);
    text-align: center;
    position: absolute;
    bottom: 15%;
} */
.banner h5 { 
    color: #6a4e3c;
    font-size: 72px;
    font-family: "Klee One","Noto Serif TC", cursive;
    -webkit-writing-mode: vertical-lr;
    writing-mode: vertical-lr ;
    font-weight: 500;
    letter-spacing: 2px;
    border-left: 1px solid #6a4e3c;
    position: absolute;
    transform: translate(-50%, -50%);
    left: 86%;
    top: 26%;
}

.banner.banF h5{
    font-size: 56px;
}


.banner.banA {}
.banner.banB { display: none;}
.banner.banC {  }
.banner.banD { background-image: url(https://pic03.eapple.com.tw/rachel/banD.png);}
.banner.banE {}
.banner.banF { background-image: url(https://pic03.eapple.com.tw/rachel/banF.png);}
.banner.banblog {  background-image: url(https://pic03.eapple.com.tw/rachel/banblog.png);}

@media screen and (max-width:1366px) {
    .banner h5{ font-size: 60px;}
    .banner:before{ width: 320px; height: 300px;}
    .banner{  padding: 800px 0px 0px;}
    .banner.banF h5{
    font-size: 48px;
}
}
@media screen and (max-width:1150px) {
    .banner{  background-image: url(https://pic03.eapple.com.tw/rachel/banC-f.png);}
    .banner.banblog {  background-image: url(https://pic03.eapple.com.tw/rachel/banblog-f.png);}
    .banner.banD { background-image: url(https://pic03.eapple.com.tw/rachel/banD-f.png);}
    .banner.banF { background-image: url(https://pic03.eapple.com.tw/rachel/banF-f.png);}
    .banner h5{ font-size: 48px; top:38%;}
    .banner.banF h5{
    font-size: 36px;
    }
    .banner:before{ top: 25%; width: 250px; height: 250px;}
}
@media screen and (max-width:1024px) {
    .banner{ margin-top: -120px;}
}
@media screen and (max-width:920px) {
    .banner{  background-image: url(https://pic03.eapple.com.tw/rachel/banC-m.png); padding: 800px 0px 200px; margin-top: -180px; }
    .banner.banblog {  background-image: url(https://pic03.eapple.com.tw/rachel/banblog-m.png);}
    .banner.banD { background-image: url(https://pic03.eapple.com.tw/rachel/banD-m.png);}
    .banner.banF { background-image: url(https://pic03.eapple.com.tw/rachel/banF-m.png);}
    .banner h5{ left: 20%; }
}
@media screen and (max-width:850px) {
    .banner{ padding: 800px 0px 0px;}
}
@media screen and (max-width:650px) {
    .banner{ padding: 700px 0px 0px; margin-top: -120px;}
    .banner:before{ width: 150px; height: 150px;}

}
@media screen and (max-width:550px) {
    .banner{ padding: 600px 0px 0px;}
    .banner:before{ width: 150px; height: 150px;}
    .banner h5{ font-size: 36px; top: 48%;}
          .banner.banF h5{
    font-size: 28px;
    left: 32%;
    }
}

@media screen and (max-width:500px) {
  .banner{  background-image: url(https://pic03.eapple.com.tw/rachel/banC-mm.png); padding: 500px 0px 0px;}
  .banner.banblog {  background-image: url(https://pic03.eapple.com.tw/rachel/banblog-mm.png);}
  .banner.banD { background-image: url(https://pic03.eapple.com.tw/rachel/banD-mm.png);}
  .banner.banF { background-image: url(https://pic03.eapple.com.tw/rachel/banF-mm.png);}
  .banner:before{ top: 34%;}
  .banner h5{ -webkit-writing-mode:horizontal-tb; writing-mode:horizontal-tb; border-left: 0px; border-bottom: 0.25px solid #6a4e3c; font-size: 32px; left: 24%;} 
}

@media screen and (max-width:380px){
    .banner{ padding: 425px 0px 0px;}
    .banner:before{ top: 39%; width: 100px; height: 100px;}
     .banner.banF h5{ font-size: 25px;}
}


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */




/*文章設定*/
/*一排呈現
.subbox_item { width:100%;}
*/
.blog_page #content,  .blog_in_page #content{
       background-image: url(https://pic03.eapple.com.tw/rachel/in-bg.jpg); 
    background-position: top;
    background-size: cover;
    background-repeat: repeat;
}
.blog_page .main_part, .blog_in_page .main_part{ max-width: 1700px;}
  
  .blog_page .show_content,.blog_in_page .show_content{ display: flex; flex-direction: column; justify-content: center; align-items: center;}
  
  /* 左邊 */
  h5.blog_le_t{    font-family: "Klee One","Noto Serif TC", cursive;
        text-align: center;
        color: #a59280;}
  .blog_le{ width: 70%;}
  .blog_search input[type=search]{ border-radius: 0px;}
  .blog_le .accordion{ border-top: 0px; border: 0px; border-radius: 0px;   display: grid; grid-template-columns:1fr 1fr 1fr 1fr 1fr;
      margin-top: 16px;
  }
  .blog_le .accordion li{  margin: 8px;}
  .accordion li .link{ text-align: center;}
  .accordion li .link a{ color: #fff;}
  .blog_le .accordion > li:hover, .blog_le .accordion > li.on_this_category { background: transparent!important;}
  .blog_le .accordion > li:hover .link, .blog_le .accordion > li.on_this_category .link{ background:#d7b69a;  transition: 0.3s;border-radius: 50px; }
  .blog_le .accordion > li.current .link, .blog_le .accordion > li.on_this_category .link{ background: #d7b69a; transition: 0.3s; border-radius: 50px; }
  .blog_le .accordion > li .link{ background: #b79378;; transition: 0.3s; border-radius: 50px;}
  
  /* 右邊 */
  /* hover移動 */
  .blog_subbox{ grid-template-columns:1fr 1fr 1fr 1fr;}
  .subbox_item{ margin-bottom: 48px; width: 100%;     transform: translate(0, 0px); transition: 0.6s; margin-right: 16px; overflow: hidden;}
  .subbox_item:last-child{ margin-right: 0px;}
  .subbox_item:hover{ transform: translate(0, -13px);}
  /* .subbox_item:nth-child(odd){ margin-right: 48px;} */
  .blog_ri{ width: 100%;}
  .blog_list_le img{ width: 100%;}
  .blog_list_ri{ width: 100%; background: transparent; padding: 24px; border:1px solid #ddd2c8;}
  .blog_list_le{ margin-bottom: 8px; width: 100%;}
  
  .blog_list_ri h5{ font-weight: bold; color: #877668;}
  .blog_list_ri p{ height: 36px; color: #000;}
  
  /* 圖片hover變大 */
  .blog_list_le {
      overflow: hidden;
    }
    .subbox_item a{
        display: flex;
        flex-direction: column;
    }
    .subbox_item a img{
      transition: all 0.3s;
    }
    .subbox_item a:hover img{
      transform: scale(1.2);
      transition: all 0.3s;
      opacity: 0.7;
    }
  
    .subbox_item a:before{
      content: " MORE+";
      color: #d7b69a;
      right: 20px;
      bottom: 95px;
       font-family: "Klee One","Noto Serif TC", cursive;
    }


    
/* hover圈圈 */
.subbox_item a::after{
    content: "VIEW";
  width: 210px;
  height: 210px;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -100%);
  opacity: 0;
  z-index: 999999999;
  position: absolute;
  border: 1px solid #877668;
  color: #877668;
  border-radius: 99em;
  transition: 0.6s;
  pointer-events: none;
    font-family: "Klee One","Noto Serif TC", cursive;
}
.subbox_item a:hover::after{
    transform: translate(-50%, -45%);
  opacity: 1;
}
.subbox_item a .blog_list_le:before {
    content: "";
    background: rgba(195,164,128,0);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    transition: .3s;
}

.subbox_item a:hover .blog_list_le:before {
    background: rgba(255,255,255,0.85);
    filter: blur(100px);
}

  
    .subbox_item a:after{ background: transparent;}
  /* box-shadow: 0px 0px 19px -3px rgba(255,255,255,0.3); */
  
  @media screen and (max-width:1024px) {
    .subbox_item a::after{
        width: 160px;
        height: 160px;
    }
  }
  @media screen and (max-width:960px) {
    .subbox_item{ border-bottom: 0px;}
  }
  @media screen and (max-width:939px) {
    .blog_le{ width: 100%;}
    .blog_le, .blog_ri{ margin-bottom: 4vw;}
  }
  
  @media screen and (max-width:425px){
  }
  
  /* 內頁 */
  h4.blog_category_title{ color: #6a4e3c; font-size: 36px;}
  .blog_page h4.blog_category_title{ display: none;}
  .blog_box_edit{ color: #fff;}
  .blog_ri{ min-height: 60vh; padding-left: 0px;}
  .blog_in_page   .blog_ri{ width: 65%;}
  .news_related{ background: transparent;}
  .news_related_list li a{ background: transparent; }
    .news_related_list li a img{ transition: 0.3s;}
  .news_related_list li a:hover img{ opacity: 0.8;}

  /* 按鈕 */

  .blog_back a{ width: 100px;}
  .blog_back a.article_btn_prev,  .blog_back a.article_btn_next, .blog_back a.article_btn_back{ background: #b79378; border-radius: 50px; }
  .blog_back a:hover.article_btn_prev,  .blog_back a:hover.article_btn_next, .blog_back a:hover.article_btn_back{ background: #d7b69a; }

  .lastPage{background: #b79378; border-radius: 50px; }
  .lastPage:hover{background: #d7b69a; border-radius: 50px; }
  
  @media screen and (max-width:1366px) {
    .blog_ri{ min-height: 70vh;}
    .blog_le .accordion{
        grid-template-columns:1fr 1fr 1fr 1fr;
    }
      .blog_subbox{ grid-template-columns:1fr 1fr 1fr;}
  }
  @media screen and (max-width:768px) {
    .blog_ri{ min-height: 80vh;}
     .blog_le .accordion{
        grid-template-columns:1fr 1fr 1fr;
    }
      .blog_subbox{ grid-template-columns:1fr 1fr;}
      .blog_in_page .blog_ri{ width: 80%;}
  }
  @media screen and (max-width:568px) {
     .blog_le .accordion{
        grid-template-columns:1fr 1fr;
    }
  }
  @media screen and (max-width:450px) {
    .blog_subbox{  grid-template-columns:1fr;}
  }

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*相本分類全版面 ( 限制最寬2000px
.work_page .main_part { max-width:2000px;}
.work_page .show_content { padding:0; width:100%;}
.work_page .show-list .item { width:33%; display:inline-block; float:none; margin:0; padding:0;}
@media screen and (max-width: 768px) {
.work_page .show-list .item { width:49%;}
}
@media screen and (max-width: 570px) {
.work_page .show-list .item { width:100%;}
}
.work_page .show-list .item a { max-width:100%;}
.work_page .show-list .show_pic { height:auto; line-height:0;}
.work_page .show-list .show_pic img { max-width:100%; max-height:100%;}
.work_page .show-list .show_name { position:absolute; top:50%; right:10%; width:80%; height:auto; line-height:160%; font-size: 20px; color: #FFFFFF !important; border: solid 1px #fff; text-align: center; margin: -20px 0 0 -120px; padding:5px 20px; transition:all ease-in .3s; opacity:0;}
.work_page .show-list .item:hover .show_name {opacity:1;}
*/


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*相本列表
.work_info_page .main_part { max-width:2000px;}
.work_info_page .show_content { padding:0; width:100%;}
.work_info_page .subalbum-menu { text-align:center;}
.work_info_page .subalbum-menu h2 { float:none;}
.work_info_page .pic-list .item { margin:0; padding:10px; width:49%; float:none; display:inline-block;}
@media screen and (max-width: 768px) {
.work_info_page .pic-list .item { width:100%;}
}
.work_info_page .pic-list .show_pic { height:auto; line-height:0;}
.work_info_page .pic-list .show_pic img { max-width:100%; max-height:100%;}
.work_info_page .pic-list .item a { max-width:100%; pointer-events: none; cursor: default; } 取消連結被點擊效果
*/


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */




.contact_page #content{
    background-image: url(https://pic03.eapple.com.tw/rachel/in-bg.jpg);
    background-position: top;
    background-size: cover;
    background-repeat: repeat;
}

.contact_content .information_left {
    width: 40%;
    padding: 3% 4.5%;
    position: relative;
    overflow: hidden;
    /* background: url(https://pic03.eapple.com.tw/oneballco/contact-l-bg.png) bottom center no-repeat rgba(238, 228, 208, 0.447); */
    background-size: cover;
    /* background-position: right -104px bottom -2px; */
    background:transparent;
    /* height: 482px; */
    /* margin-top: 60px; */
    border-radius: 20px;
    position: relative;
}

.contact_content .information_left:before{
    content: "";
    background-image: url(https://pic03.eapple.com.tw/rachel/contact-l-top.png);
    background-size: cover;
    width: 100%;
    height: 105px;
    position: absolute;
    top: -21px;
    left: 0px;
}

/* 聯絡我們 */
.blank_letter{  color: transparent; margin-bottom: -32px; margin-top: 24px;}
.blank_letter.f { margin-top: 53px;}
.blank_letter .note {  color: transparent;}
     /* 表單多的文字 */
     .blank_letter.f:before {
        content: '線上表單';
        font-family: "Klee One","Noto Serif TC", cursive;
        font-size: clamp(2.35rem, 16px + 1.5vw, 1.8rem);
        padding-right: 10px;
        color: #a59280;
        font-weight: 500;
        letter-spacing: 0px;
    }

    .blank_letter:before {
        content: '聯絡資訊';
        display: block;
        font-size: clamp(2.35rem, 16px + 1.5vw, 1.8rem);
        color: #a59280;
        font-weight: 500;
        letter-spacing: 0px;
        font-family: "Klee One","Noto Serif TC", cursive;
    }
.list_before.info li.info_PHONE{ display: none;}
.contact_content .information_left{ width: 400px; border-radius: 20px;}
.contact_content .information_right{ width: calc(100% - 420px);}

.contact_form li .form__label{ color: #000; display: flex; flex-direction: row-reverse; justify-content: flex-end; max-width: 238px; text-align: left;}
.contact_form li input.noborder{  border:1px solid #a3978d8f; background: unset; color: #000;  border-radius: 50px; padding: 10px;}
.contact_form li textarea.noborder{  border: 1px solid #a3978d8f ; background: unset; color: #000; border-radius: 25px; padding: 10px;}
.noborder{ padding: 8px 0;}
.contact_form li{ padding: 0 0  20px 0; grid-template-columns:250px 1fr; }
.contact_form li .form__insert{ color: #000;}

.contact_form li:has(input[type=checkbox]) .form__insert, .contact_form li:has(input[type=radio]) .form__insert{ display: flex; flex-wrap: wrap;}

.contact_form li.last cite{ background: #d7b69a;}
.contact_form li.last blockquote{ color: #d7b69a;}
.contact_form li.last blockquote, .contact_form li.last cite { border: 1px solid #d7b69a;  border-radius: 100px;}


@media screen and (max-width:1040px) {
    .contact_content .information_right{ width: 100%;}
    .contact_content form{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .blank_letter:before{ margin-top: 24px;}
    .contact_content .information_left{ width: 100%;}
    .contact_content .information_left:before{height: 105px; background-repeat: no-repeat; background-size: contain; }
}
@media screen and (max-width:600px) {
    .contact_form li .form__label{ background: transparent;}
    .contact_page .main_part{ padding: 50px 0px 10px;}
}
@media screen and (max-width:500px) {
    .contact_form li{ grid-template-columns:1fr;}
}
@media screen and (max-width:400px) {
    .contact_content .information_left{ width: 330px;}
    .contact_content .information_left:before{ background-size: 100%; background-repeat: no-repeat;}
}






.car_page .information_left {
    display: block;
}
body.car_page .footer_info li p:before{
    position: initial;
    display: inline;
}
.contact_le_map a{background: #d7b69a; width: 200px; border-radius: 50px; }




@media screen and (max-width: 768px) {
/* 開啟手機板下方按鈕所需設定 */
#bottom_menu {}
.footer.with_shopping_mode { padding:30px 0 55px; }
#to_top { bottom:60px;}
}

@media screen and (max-width: 600px) { 
}




