#member-function { position: fixed; right: 70px; z-index: 1000; width: 165px; top: 85px; }
#member-function > ul { display: grid; grid-template-columns: repeat(3,1fr); gap: 35px; align-items: center; }
#member-function > ul > li {   }
#member-function ul .sidetop a { position: relative; width: 60px; height: 60px }
#member-function ul .sidetop a:before { position: absolute; width: 25%; height: 25%; border: solid #ffffff; border-width: 2px 0 0 2px; display: block; top: calc((100% - 7px)/2); left: calc((100% - 30px)/2); content: ""; transform: rotate(45deg); -webkit-transform: rotate(45deg) }
#member-function ul li.topMenu { display: none }
#member-function ul li a { width: 100%; display: block; }
#member-function ul li i { width: 50px; height: 50px; display: inline-block; float: left; text-align: center; line-height: 54px; color: #fff }
#member-function ul li a b { width: 90px; display: none; float: left; transition: all 0.4s ease; line-height: 54px; color: #fff; text-align: center }
#member-function ul li:first-child > i { float: left; font: normal normal normal 14px/1 FontAwesome; line-height: 54px }
#member-function ul li:first-child > i:before { content: "\f007" }
#member-function ul li.pcount a { display: flex; align-items: center; justify-content: center; position: relative; gap: 15px }
#member-function ul li.pcount a svg,#member-function ul li.member a svg { fill: #ffffff; width: 25px; height: 25px }
#member-function ul li.pcount a span { background-color: var(--primary); padding: 2px; width: 18px; height: 18px; display: flex; flex-direction: row; justify-content: center; align-items: center; position: absolute; top: -6px; right: -7px; font-size: 11px; border-radius: 50%; line-height: 15px; color: white; font-weight: 200; }
#member-function ul li.pcount a:last-child { background-color: #f3f3f3; line-height: 160%; text-align: center; padding: 12px 28px; font-size: 14px }
#member-function ul li.pcount ul.sub-order-list li { position: relative; display: grid; gap: 10px; }
#member-function ul li.pcount ul.sub-order-list li.close-item{position:fixed;right: 70px;display: inline-block;width: auto;top: 82px;}
#member-function ul li.pcount ul.sub-order-list li.close-item a{background:none;padding: 0;}
#member-function ul li.pcount ul.sub-order-list li:first-child { width: 100%; inset: 0; max-height: 90%; overscroll-behavior: none; overflow: hidden; overflow-y: auto }
#member-function ul li.pcount ul.sub-order-list li:first-child::selection { background: #e3e3e3; text-shadow: none; color: #fff }
#member-function ul li.pcount ul.sub-order-list li:first-child::-webkit-scrollbar { width: 5px }
#member-function ul li.pcount ul.sub-order-list li:first-child::-webkit-scrollbar-track { background: #ededed }
#member-function ul li.pcount ul.sub-order-list li:first-child::-webkit-scrollbar-thumb { background: #e3e3e3 }
#member-function ul li.pcount ul.sub-order-list li:first-child::-webkit-scrollbar-thumb:hover { background: #e3e3e3 }
#member-function ul li.pcount ul.sub-order-list li #shopping-list .list {padding: 10px 10px;style="color: red; ";display: grid;grid-template-columns: 180px 1fr;gap: 30px;align-items: center;}
#member-function ul li.pcount ul.sub-order-list li #shopping-list p,#member-function ul li.pcount ul.sub-order-list li #op-sum,#member-function ul li.pcount ul.sub-order-list li #op-sum b {font-size: 17px;font-weight: 400;letter-spacing: 1.5px;}
#member-function ul li.pcount ul.sub-order-list li p.buttons a { background-color: var(--info); color: var(--light); display: flex; flex-direction: column; align-items: center; border-radius: 5px; }
#member-function ul li.pcount ul.sub-order-list li p.buttons:last-child a { background: none; border: 2px solid var(--info); color: var(--info); }
#member-function ul li.pcount ul.sub-order-list li #shopping-list b { color: #4f4f4f; font-size: 13px; vertical-align: baseline }
#member-function ul li.pcount ul.sub-order-list li #shopping-list .cart-price { display: grid; grid-template-columns: 50px 10px 1fr; gap: 4px; align-items: center }
#member-function ul li.pcount ul.sub-order-list li #shopping-list .cart-price input { padding: 0 10px; text-align: center }
#member-function ul li.pcount ul.sub-order-list li  #op-sum {padding: 20px 0 10px;display: flex;align-items: center;justify-content: space-between;border-top: 1px solid #ddd;}
#member-function ul li.pcount ul.sub-order-list li #shopping-list .cart-info { position: relative }
#member-function ul li.pcount ul.sub-order-list li #shopping-list .list h3 {line-height: 170%;font-size: 18px;color: #333333;font-weight: 500;width: 90%;margin-bottom: 10px}
#member-function ul li.pcount ul.sub-order-list li #shopping-list .list img {width: 100%;background: linear-gradient(165.49deg, #D1D0CE 0%, #E3E2E0 12.1%, #F7F6F4 58.66%, #F8F8F6 87.31%);padding: 0 10px;aspect-ratio: 3.5/4;object-fit: contain;}
#member-function ul li.pcount ul.sub-order-list li #shopping-list .list p { font-size: 12px }
#member-function ul li.pcount ul.sub-order-list li #shopping-list .list p.cart-close { position: absolute; top: 0; right: 0 }
#member-function ul li.pcount ul.sub-order-list li #shopping-list .list p.cart-close a { padding: 8px; line-height: 80%; margin-top: 0 }
#member-function ul li.member a { height: 100%; display: flex; align-items: center; justify-content: center; width: 100%; }
#member-function ul li .member-site { width: 0; background: #000; float: left; opacity: 0.8; transition: all 0.4s ease; overflow: hidden }
#member-function ul li:hover .member-site { width: 250px; height: 54px; overflow: hidden }
#member-function ul li .member-site a { width: 125px; display: block; float: left; line-height: 54px; color: #fff }
#member-function ul li .member-site a .sidebox { line-height: 54px; width: 150px }
#member-function ul li .member-site a i { width: 54px; height: 54px; display: inline-block; text-align: center; line-height: 54px }
.mobileList { position: fixed; width: 100%; display: none; bottom: 0; z-index: 500 }
.mobileList .topIcon { text-align: right }
.mobileList .topIcon a { margin: 10px; width: 50px; height: 50px; background: #333; border-radius: 50%; display: inline-block; text-align: center; line-height: 44px; font-size: 20px; color: #fff }
.mobileList ul { overflow: hidden }
.mobileList ul li { float: left; background: #333333; width: 20%; min-height: 68px }
.mobileList ul li .sidebox { text-align: center }
.mobileList ul li a { padding: 10px 0; width: 100%; height: 100%; display: block; color: #fff; text-align: center; font-size: 12px; border-right: 1px #fff solid; font-family: 微軟正黑體,蘋果儷中黑,"Lucida Grande",Arial,"Arial Narrow" }
.mobileList ul li a i,#member-function ul li i { display: block; font-size: 20px }
#member-function ul li i { font-size: inherit }
.mobileList ul li a i b,#member-function ul li i span { position: absolute; width: 15px; height: 15px; margin-left: 5px; font-size: 12px; font-weight: normal; background: #ffffff; border-radius: 50%; line-height: 15px }
#member-function ul li i span { margin-top: 10px; text-align: center }
.overlay-bg { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.7); z-index: 99; opacity: 0; visibility: hidden; transition: opacity 0.3s ease,visibility 0.3s ease }
.overlay-bg.active { opacity: 1; visibility: visible }
#member-function ul li.pcount ul.sub-order-list {position: fixed;z-index: 100;top: 0;right: 0;width: 50vw;max-width: 720px;height: 100vh;background-color: #fff;display: flex;flex-direction: column;justify-content: space-between;padding: 50px 5vw;box-sizing: border-box;opacity: 0;visibility: hidden;transform: translate3d(110%,0,0);transition: none;}

/* 頁面完成後才開啟動畫，避免一進頁面看到滑動/扁縮 */
body.is-loaded #member-function ul li.pcount ul.sub-order-list { transition: transform 0.6s ease,opacity 0.3s ease,visibility 0s linear 0.6s; }
body.is-loaded #member-function ul li.pcount ul.sub-order-list.active { opacity: 1; visibility: visible; transform: translate3d(0,0,0); transition: transform 0.6s ease,opacity 0.3s ease,visibility 0s; }
#member-function ul li.pcount #go_product { padding: 30% 2em 0; }
#member-function ul li.pcount #go_product p { margin: .8em 0; display: flex; justify-content: center; align-items: center; gap: .3em; }
#member-function ul li.pcount #go_product p a { margin: 0; padding: 0 .5em; width: auto; background-color: transparent; line-height: 1.7; font-size: 1em; text-decoration: underline; }
#member-function ul li.pcount #go_product p:nth-child(2),#member-function ul li.pcount #go_product p:nth-child(2) * { color: #6c6c6c; }
#hSearch { display: none !important; }
#hSearch.open { display: flex !important; opacity: 1; }

/* 搜尋表單：預設關閉 */
#hSearch {display: none;position: absolute;left: 150px;width: 260px;padding: 8px;background: rgb(255 255 255/5%);border-radius: 10px;box-shadow: 0 10px 25px rgba(0,0,0,.15);z-index: 1002;align-items: center;gap: 8px;opacity: 0;}
/* 打開狀態（唯一控制點） */
#hSearch.open { display: flex; }
/* 輸入框 */
#hSearch input[type="text"] { flex: 1; height: 38px; border: none; outline: none; font-size: 15px; color: #333; background: transparent; padding: .6rem 1rem .6rem 3rem; letter-spacing: 1px; }
#hSearch input::placeholder { color: #aaa; }
/* 搜尋按鈕 */
#hSearch #go_search { width: 36px; height: 36px; min-width: 36px; border-radius: 50%; border: none; background: rgba(0,0,0,0.05); display: flex; align-items: center; justify-content: center; cursor: pointer; }
#hSearch #goSearch:hover { background: rgba(0,0,0,0.1); }
#member-function.scroll ul li.member a svg,#member-function.scroll ul li.pcount a svg { fill: #262626; }

@media screen and (max-width:1280px) {
    #member-function ul li.pcount ul.sub-order-list{padding: 50px 5vw;width: min(60%, 900px);max-width: unset;}
}
@media screen and (max-width:768px) {
    #member-function ul li.pcount ul.sub-order-list{width: 80vw;}
    #member-function ul li.pcount ul.sub-order-list li.close-item{right: 25px;}
    #hSearch{left: 50px;width: 220px;}
	.mobileList { display: block }
	#member-function {width: auto;right: 25px;}
    #member-function > ul{gap: 20px;}
}
@media screen and (max-width:640px) {
    #member-function ul li.pcount ul.sub-order-list li #shopping-list .list{grid-template-columns: 130px 1fr;}
    #member-function ul li.pcount ul.sub-order-list li.close-item{top: 35px;}
    #member-function ul li.pcount ul.sub-order-list{width: 100%;padding: 80px 5vw;}
	#member-function {top: 70px;}
    #member-function ul li.pcount a svg, #member-function ul li.member a svg{width: 18px;height: 18px;}
    #hSearch{top: 80px;left: 10px;background: #e9e5dd;}
    #hSearch input[type="text"]{padding: .6rem 1rem;}
}