@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;700&display=swap");








/* JS初期化を待つHTMLも完成後と同じ高さ・並びで表示する。 */








[data-guricha-header]:not(.gch){box-sizing:border-box;display:grid;grid-template-columns:190px minmax(0,1fr) repeat(3,44px);align-items:center;gap:6px;max-width:1440px;min-height:80px;margin:0 auto;padding:10px 24px;background:white;color:#3f3732;font:16px/1.65 "Noto Sans JP","Yu Gothic",sans-serif;text-align:left}








[data-guricha-header]:not(.gch) *{box-sizing:border-box}








[data-guricha-header]:not(.gch)>.gch-logo{min-height:44px;min-width:0;padding:0}








[data-guricha-header]:not(.gch)>.gch-static-navigation{display:flex;align-items:center;gap:26px;min-width:0;margin:0 26px}








[data-guricha-header]:not(.gch) .gch-static-navigation>details{margin:0;padding:0;border:0;min-width:0}








[data-guricha-header]:not(.gch) .gch-static-navigation .gch-nav-button,[data-guricha-header]:not(.gch) .gch-static-navigation>.gch-news{display:inline-flex;align-items:center;gap:2px;min-height:44px;padding:6px 0;margin:0;list-style:none;white-space:nowrap;font:500 15px/1.4 "Noto Sans JP","Yu Gothic",sans-serif;letter-spacing:-.02em;color:#3f3732;text-decoration:none}








[data-guricha-header]:not(.gch) summary::-webkit-details-marker{display:none}








[data-guricha-header]:not(.gch) .gch-menu-icon,[data-guricha-header]:not(.gch) .gch-menu-icon svg{display:block;width:19px;height:19px}








[data-guricha-header]:not(.gch)>:is([data-gcm-search-root],.gsp-host,a:not(.gch-logo)){visibility:hidden;width:44px;height:44px;min-width:0}








@media(min-width:1101px){[data-guricha-header]:not(.gch)>.gch-static-navigation{transform:translateY(12px)}}








@media(min-width:601px) and (max-width:1100px){








 [data-guricha-header]:not(.gch){grid-template-columns:190px minmax(0,1fr) repeat(3,44px);gap:0 6px;min-height:108px;padding:10px 20px}








 [data-guricha-header]:not(.gch)>.gch-static-navigation{grid-column:1/-1;grid-row:2;gap:24px;margin:0}








 [data-guricha-header]:not(.gch)>[data-gcm-search-root],[data-guricha-header]:not(.gch)>.gsp-host{grid-column:3;grid-row:1}








 [data-guricha-header]:not(.gch)>a:not(.gch-logo):not([data-gch-cart]){grid-column:4;grid-row:1}








 [data-guricha-header]:not(.gch)>[data-gch-cart]{grid-column:5;grid-row:1}








}








@media(max-width:600px){








 [data-guricha-header]:not(.gch){grid-template-columns:minmax(0,1fr) repeat(3,44px);gap:0;min-height:111px;width:calc(100% - 16px);margin:0 8px;padding:8px}








 [data-guricha-header]:not(.gch)>.gch-static-navigation{grid-column:1/-1;grid-row:2;gap:0;margin:6px 0 0;border-top:1px solid #e1e6dc}








 [data-guricha-header]:not(.gch) .gch-static-navigation>details:not([data-gch-static-kind="order"]),[data-guricha-header]:not(.gch) .gch-static-navigation>.gch-news{display:none}








 [data-guricha-header]:not(.gch) .gch-static-navigation .gch-nav-button{font-size:13px}








 [data-guricha-header]:not(.gch) .gch-leaf{width:16px;height:16px}








}








/* 共有資産。リセット・ヘッダーの指定は .gch の内部だけに限定。 */








.gch{--gch-ink:#3f3732;--gch-green:#66a73b;--gch-soft:#f3f5ee;--gch-line:#e1e6dc;color:var(--gch-ink);font-family:"Noto Sans JP","Yu Gothic",sans-serif;font-size:16px;line-height:1.65;text-align:left;color-scheme:light;isolation:isolate;position:relative;z-index:1000}








.gch *,.gch *::before,.gch *::after{box-sizing:border-box}








.gch [hidden]{display:none!important}








.fs-clientInfo[data-gch-shop-source][hidden]{display:none!important}








.gch a,.gch button,.gch input,.gch summary{font:inherit;color:inherit;letter-spacing:normal;text-transform:none}








.gch a:link,.gch a:visited,.gch a:hover,.gch a:active,.gch a:focus{color:var(--gch-link-color,var(--gch-ink))!important;text-decoration:none!important}.gch a .gch-label{color:inherit;text-decoration:none!important}.gch button{appearance:none;border:0;background:none;cursor:pointer;margin:0;box-shadow:none;border-radius:3px}








.gch button,.gch a,.gch summary{min-height:44px}








.gch a:hover,.gch button:hover,.gch summary:hover{background:var(--gch-soft);color:var(--gch-green)}








.gch :focus-visible{outline:3px solid var(--gch-green);outline-offset:2px}








.gch h2,.gch h3,.gch h4,.gch p{padding:0;letter-spacing:normal;line-height:1.65;background:none;color:inherit;border:0}








.gch-header{position:relative;background:white;border-bottom:0;width:100%}








.gch-bar{max-width:1440px;margin:0 auto;display:flex;align-items:center;gap:32px;padding:10px 24px;min-height:80px}








.gch-logo{flex:0 0 190px;display:flex;align-items:center}.gch-logo img{display:block;width:190px;height:auto;max-width:100%}








.gch .gch-seal{display:none;flex:0 0 44px;width:44px;height:44px;align-items:center;justify-content:center;border-radius:3px}








.gch .gch-seal img{display:block;width:36px;height:36px;max-width:none;object-fit:contain}








.gch.gch-ghost .gch-seal{display:flex}








@media(max-width:600px){.gch.gch-ghost .gch-seal{flex-basis:36px;width:36px}.gch.gch-ghost .gch-seal img{width:28px;height:28px}}








.gch-nav{display:flex;align-items:center;gap:26px;flex:1;min-width:0}








.gch .gch-nav-button,.gch .gch-news{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;font-size:15px;font-family:inherit!important;font-weight:500!important;color:var(--gch-ink)!important;padding:6px 0}








.gch-nav-text{display:block;line-height:1.4}








.gch .gch-nav-button[aria-expanded="true"]{background:var(--gch-soft)}








@media(min-width:1101px){.gch:not(.gch-ghost) .gch-nav,.gch:not(.gch-ghost) .gch-tools{transform:translateY(12px)}}








.gch-leaf{width:19px;height:19px;object-fit:contain}.gch-tools{display:flex;gap:6px;align-items:center;margin-left:auto;flex:none}








.gch .gch-tool{display:inline-flex;justify-content:center;align-items:center;position:relative;min-width:44px;height:44px;padding:9px;gap:3px}








.gch-icon{display:inline-flex;position:relative;width:24px;height:24px;flex:none}.gch-icon svg{display:block;width:24px;height:24px}








.gch .gch-cart{min-width:44px}.gch-count{position:absolute;top:0;right:0;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;min-width:20px;height:20px;background:#66a73b;color:white;font-size:12px;line-height:1;padding:0 3px;pointer-events:none}








.gch .gch-menu-icon,.gch .gch-menu-icon svg{width:17px;height:17px;color:var(--gch-green)}.gch .gch-menu-icon svg{stroke-width:1.65}








.gch .gch-tools .gch-icon,.gch .gch-tools .gch-icon svg{width:21px;height:21px}.gch .gch-tools .gch-icon svg{stroke-width:1.7}








.gch-check{display:none}.gch-logged [data-gch-panel="account"]::before{content:"";position:absolute;width:34px;height:34px;border-radius:50%;background:#66a73b}








.gch-logged [data-gch-panel="account"] .gch-icon{color:white}.gch-logged .gch-check{position:absolute;display:flex;align-items:center;justify-content:center;top:0;right:0;border:2px solid white;border-radius:50%;background:#66a73b;color:white;width:21px;height:21px;font-size:16px;font-weight:700;line-height:1}








.gch .gch-mobile{display:none}








.gch-panel{--gch-panel-bg:#fcfbf8;--gch-soft:#f2f3ed;--gch-line:#e5e2d9;position:absolute;top:100%;left:0;right:0;padding:20px 24px;background:var(--gch-panel-bg);border:1px solid var(--gch-line);box-shadow:0 8px 16px #23331d18;max-height:calc(100dvh - 180px);overflow:auto;overscroll-behavior:contain}








.gch-panel-top{display:flex;align-items:center;gap:24px;margin-bottom:12px;position:relative;padding-right:44px;min-height:44px}








.gch .gch-heading{font-size:17px;font-weight:500;margin:0;white-space:nowrap}








.gch .gch-close{position:absolute;right:0;top:0;width:44px;height:44px;font-size:28px;line-height:1}








.gch-overview{display:flex;gap:24px}.gch-overview .gch-link{font-size:14px}








.gch-link{display:flex;align-items:center;gap:7px;padding:9px 8px;overflow-wrap:anywhere;min-width:0;font-weight:400}








.gch a.gch-link{font-family:inherit!important;font-weight:400!important}.gch .gch-account-links>a.gch-link:first-child{font-weight:500!important}








.gch .gch-account-links>a.gch-link.gch-register{font-weight:600!important}








.gch-label{min-width:0;overflow-wrap:anywhere}.gch-photo{display:block;width:48px;height:56px;object-fit:contain;flex:none;background:white}








.gch-product-icon{display:block;width:21px;height:21px;object-fit:contain;flex:none}








.gch-photos{display:inline-flex;gap:4px;flex:none}.gch-links>.gch-link:has(.gch-photos){grid-column:1/-1}








.gch-workspace{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;max-width:1390px;margin:auto}








.gch-category{border-bottom:1px solid var(--gch-line)}








.gch .gch-category-button,.gch a.gch-category-link{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:52px;text-align:left;padding:12px;font-size:15px;font-family:inherit!important;font-weight:500!important;color:var(--gch-ink)!important;background:var(--gch-soft);border-radius:3px}








.gch-category{padding:4px 0}.gch-category-label{min-width:0}.gch-arrow{display:flex;align-items:center;justify-content:center;flex:none;width:24px;height:24px;border:1px solid var(--gch-line);border-radius:50%;background:white;font-size:20px;line-height:1}.gch-arrow::before{content:'+'}.gch-category-button[aria-expanded="true"] .gch-arrow::before{content:'−'}








.gch-link-arrow{display:flex;align-items:center;justify-content:center;flex:none;width:24px;height:24px;font-size:20px;line-height:1}








.gch .gch-selected>.gch-category-button{box-shadow:inset 0 0 0 1px var(--gch-line)}








.gch .gch-category-button:hover,.gch a.gch-category-link:hover{background:var(--gch-soft);box-shadow:inset 0 0 0 1px var(--gch-green)}








.gch-detail{border-left:1px solid var(--gch-line);padding-left:24px;min-width:0}








.gch-accordion .gch-workspace{grid-template-columns:1fr;gap:0}.gch-accordion .gch-detail{display:none}.gch-accordion .gch-content{padding:12px 8px 20px;grid-template-columns:1fr;gap:8px}.gch-accordion .gch-content>.gch-links,.gch-accordion .gch-product-section .gch-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}








.gch-content{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;min-width:0}








.gch:not(.gch-accordion) .gch-content{grid-template-columns:repeat(2,minmax(0,1fr))}








.gch-content>.gch-links{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}








.gch .gch-subheading{font-size:15px;font-weight:500;margin:8px 0 4px;padding:10px 8px;border-top:1px solid var(--gch-line)}








.gch-menu-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}








.gch-panel[data-kind="order"],.gch-panel[data-kind="about"],.gch-panel[data-kind="guide"]{right:auto}








.gch-panel[data-kind="about"] .gch-menu-groups,.gch-panel[data-kind="guide"] .gch-menu-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}








.gch-menu-group{margin-bottom:20px}.gch-menu-group .gch-subheading{font-size:16px}








.gch-panel[data-kind="account"],.gch-panel[data-kind="search"]{left:auto;right:16px;width:min(420px,calc(100% - 32px));padding:20px}








.gch .gch-name{font-size:17px;overflow-wrap:anywhere;margin:10px 0}








.gch .gch-points{background:var(--gch-soft);padding:10px 12px;margin:10px 0;overflow-wrap:anywhere}








.gch-account-links>.gch-link{border:1px solid var(--gch-line);justify-content:center;margin:6px 0}








.gch-account-links>.gch-link:first-child{--gch-link-color:white;background:var(--gch-green);color:white}








.gch-settings summary{cursor:pointer;display:flex;align-items:center;padding:8px}.gch-search{display:flex;gap:8px;margin:12px 0 0}








.gch-search input{width:100%;min-width:0;border:1px solid var(--gch-line);background:white;padding:10px 12px;font-size:16px;border-radius:3px}








.gch .gch-search button{background:var(--gch-green);color:white;min-width:66px;padding:8px}








.gch.gch-ghost{position:fixed;top:0;left:0;right:0;z-index:1000}.gch-ghost .gch-header{position:relative;box-shadow:0 2px 8px #23331d18}








.gch-ghost .gch-logo{display:none}








.gch-ghost .gch-bar{min-height:56px;padding-top:0;padding-bottom:0}.gch-ghost .gch-panel{max-height:calc(100dvh - 56px)}








.gch-shop-frame{position:absolute;width:1px;height:1px;left:0;top:0;border:0;clip-path:inset(100%);pointer-events:none}








@media(min-width:601px) and (max-width:1100px){.gch:not(.gch-ghost) .gch-bar{display:grid;grid-template-columns:190px 1fr;gap:0 16px;padding:10px 20px}.gch:not(.gch-ghost) .gch-tools{grid-column:2;grid-row:1;justify-self:end}.gch:not(.gch-ghost) .gch-nav{grid-column:1/-1;grid-row:2;justify-content:flex-start;gap:24px}.gch-panel{max-height:calc(100dvh - 180px)}.gch-workspace{grid-template-columns:210px minmax(0,1fr);gap:16px}.gch-detail{padding-left:16px}.gch-content{grid-template-columns:1fr}.gch-product-section .gch-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}}








@media(max-width:600px){.gch:not(.gch-ghost) .gch-bar{display:grid;grid-template-columns:1fr;gap:0;padding:8px 14px}.gch-logo{padding:4px 0}.gch:not(.gch-ghost) .gch-nav{display:none}.gch:not(.gch-ghost) .gch-tools{width:100%;justify-content:space-between;margin:0}.gch:not(.gch-ghost) .gch-mobile{display:inline-flex}.gch-ghost .gch-bar{padding:0 8px;gap:4px}.gch-ghost .gch-nav-button{font-size:14px;gap:4px}.gch-ghost .gch-tools{gap:0}.gch-ghost .gch-tool{width:44px;min-width:44px;padding:8px}.gch-ghost .gch-cart{width:auto;min-width:49px}.gch-panel{padding:14px;max-height:calc(100dvh - 140px)}.gch-panel-top{display:block;padding:0;margin-bottom:12px}.gch .gch-heading{display:flex;align-items:center;min-height:44px;padding-right:44px;font-size:16px}.gch-overview{gap:12px;flex-wrap:wrap}.gch-overview .gch-link{padding:8px 0;font-size:14px}.gch-workspace{grid-template-columns:1fr;gap:0}.gch-detail{display:none}.gch-content{padding:8px 4px 14px;grid-template-columns:1fr;gap:4px}.gch-content>.gch-links{grid-template-columns:1fr}.gch-menu-groups{grid-template-columns:1fr;gap:0}.gch-panel[data-kind="account"],.gch-panel[data-kind="search"]{right:8px;width:calc(100% - 16px);padding:16px}.gch-mobile-links{display:flex;flex-direction:column}.gch-mobile-links .gch-nav-button{padding:10px 8px}}








@media(prefers-reduced-motion:reduce){.gch *{scroll-behavior:auto}}








@media(max-width:600px){.gch-accordion .gch-content>.gch-links,.gch-accordion .gch-product-section .gch-links{grid-template-columns:1fr}}








@media(max-width:600px){








 .gch:not(.gch-ghost){width:var(--gch-mobile-width,auto);margin-left:var(--gch-mobile-shift,0px)}








 .gch:not(.gch-ghost) .gch-bar{grid-template-columns:minmax(0,1fr) auto;column-gap:8px;padding:8px}








 .gch:not(.gch-ghost) .gch-logo{grid-column:1;grid-row:1;min-width:0;padding:0}








 .gch:not(.gch-ghost) .gch-tools{grid-column:2;grid-row:1;width:auto;gap:0;justify-content:flex-end}








 .gch:not(.gch-ghost) .gch-tools .gch-tool,.gch:not(.gch-ghost) .gch-tools .gsp-trigger{width:44px;min-width:44px;height:44px;padding:8px}








 .gch:not(.gch-ghost) .gch-nav{display:grid;grid-column:1/-1;grid-row:2;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:0 8px;width:100%;margin-top:6px;border-top:1px solid var(--gch-line)}








 .gch:not(.gch-ghost) .gch-nav [data-gch-panel="order"]{grid-column:1;grid-row:1}








 .gch:not(.gch-ghost) .gch-nav [data-gch-panel="about"]{grid-column:2;grid-row:1}








 .gch:not(.gch-ghost) .gch-nav [data-gch-panel="guide"]{grid-column:1;grid-row:2}








 .gch:not(.gch-ghost) .gch-news{grid-column:2;grid-row:2}








 .gch:not(.gch-ghost) .gch-nav-button,.gch:not(.gch-ghost) .gch-news{font-size:13px;min-width:0;gap:4px;white-space:normal;text-align:left}








 .gch:not(.gch-ghost) .gch-mobile{display:none}








 .gch:not(.gch-ghost) .gch-panel{max-height:calc(100dvh - 230px)}








 .gch:not(.gch-ghost) .gch-leaf,.gch:not(.gch-ghost) .gch-menu-icon,.gch:not(.gch-ghost) .gch-menu-icon svg{width:14px;height:14px;flex:none}








}








@media(max-width:600px){.gch-panel[data-kind="about"] .gch-menu-groups,.gch-panel[data-kind="guide"] .gch-menu-groups{grid-template-columns:1fr;gap:0}}

















.gch-links>.gch-list-entry{grid-column:1/-1;border-bottom:1px solid var(--gch-line);margin-bottom:4px}

















.gch-category-label--with-note{display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap}.gch .gch-category-note{font-size:12px;font-weight:400}

















.gch:not(.gch-accordion) .gch-panel[data-kind="order"] .gch-panel-top{display:block}.gch:not(.gch-accordion) .gch-panel[data-kind="order"] .gch-heading{display:flex;align-items:center;min-height:44px}.gch:not(.gch-accordion) .gch-panel[data-kind="order"] .gch-overview{gap:16px;white-space:nowrap}.gch:not(.gch-accordion) .gch-order-collapsed .gch-workspace{grid-template-columns:260px;gap:0}

















/* ページ入口リンク：商品写真/カテゴリ/会員操作から分離。 */








.gch a.gch-page-link{position:relative;min-height:48px;padding:10px 0;font-weight:500!important;border:0;box-shadow:none;background:transparent;border-radius:0}








.gch a.gch-page-link>.gch-label{position:relative;display:block;width:100%;line-height:1.4;padding-bottom:3px}








.gch a.gch-page-link>.gch-label::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:1px;background:var(--gch-green);transition:width .22s}








.gch a.gch-page-link:hover,.gch a.gch-page-link:active{background:transparent}








.gch a.gch-page-link:hover>.gch-label::after,.gch a.gch-page-link:focus-visible>.gch-label::after,.gch a.gch-page-link:active>.gch-label::after{width:100%}








.gch .gch-menu-group a.gch-page-link{margin-bottom:12px}








@media(prefers-reduced-motion:reduce){.gch a.gch-page-link>.gch-label::after{transition:none}}

















/* 見出しと配下リンクの階層。カテゴリ行/会員操作は既存指定を維持。 */








.gch .gch-panel .gch-heading{font-family:inherit!important;font-size:17px;font-weight:500!important}








.gch .gch-menu-group .gch-subheading,.gch .gch-product-section .gch-subheading{font-family:inherit!important;font-size:16px;font-weight:500!important;margin:20px 0 8px;padding:12px 0 0}








.gch .gch-product-section .gch-subheading{font-size:15px}








.gch .gch-panel a.gch-page-link{font-size:15px;font-weight:400!important}








.gch .gch-menu-group>a.gch-page-link{margin-left:14px;margin-bottom:12px}








.gch .gch-content>.gch-links,.gch .gch-product-section>.gch-links{margin-left:14px}








.gch .gch-panel[data-kind="order"] .gch-content a.gch-link{font-size:15px;font-weight:400!important;padding-left:0;padding-right:0}








.gch .gch-panel[data-kind="order"] .gch-overview{margin-top:8px;margin-bottom:12px}








@media(max-width:600px){








 .gch .gch-panel .gch-heading{font-size:16px}








 .gch .gch-panel a.gch-page-link,.gch .gch-panel[data-kind="order"] .gch-content a.gch-link{font-size:14px}








 .gch .gch-menu-group>a.gch-page-link{margin-left:8px}








 .gch .gch-content>.gch-links,.gch .gch-product-section>.gch-links{margin-left:8px}








 .gch.gch-accordion .gch-content{padding-left:12px;padding-right:4px}








}

















/* スマホの項目間余白と、スクロール領域外の閉じる操作。 */








@media(max-width:600px){.gch .gch-panel a.gch-page-link{min-height:44px;padding-top:8px;padding-bottom:8px}.gch .gch-menu-group>a.gch-page-link{margin-bottom:6px}.gch .gch-menu-group>a.gch-page-link:last-child{margin-bottom:0}.gch .gch-menu-group{margin-bottom:0}.gch .gch-menu-group .gch-subheading,.gch .gch-product-section .gch-subheading{margin-top:14px;margin-bottom:6px;padding-top:8px}.gch .gch-menu-group:first-child .gch-subheading{margin-top:4px}.gch .gch-category{padding:2px 0}.gch .gch-category-button,.gch a.gch-category-link{min-height:48px;padding:10px 12px}.gch .gch-panel[data-kind=order] .gch-content a.gch-link:not(.gch-page-link){padding-top:5px;padding-bottom:5px}.gch.gch-accordion .gch-content{padding:8px 12px 12px;gap:6px}.gch.gch-accordion .gch-content>.gch-links,.gch.gch-accordion .gch-product-section .gch-links{gap:6px}}

















.gch-panel-scroll{display:contents}.gch .gch-bottom-close{display:none}








@media(max-width:1100px){








 .gch .gch-panel[data-kind="order"],.gch .gch-panel[data-kind="about"],.gch .gch-panel[data-kind="guide"]{display:flex;flex-direction:column;overflow:hidden;padding:0}








 .gch .gch-panel-scroll{display:block;flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:14px}








 .gch .gch-bottom-close{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:100%;min-height:48px;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--gch-line);border-radius:0;background:var(--gch-panel-bg);font-family:inherit;font-size:15px;font-weight:500;color:var(--gch-ink)}








}

















.gch-menu-view{display:contents}








@media(max-width:1100px){.gch .gch-menu-view:not([hidden]){display:flex;flex-direction:column;min-height:0;flex:1 1 auto}}

















/* 店舗・通販の実リンクだけに、読み上げ対象にならない細線の菱形を添える。 */








.gch .gch-panel:is([data-kind="about"],[data-kind="guide"]) .gch-menu-group>a.gch-page-link{align-items:flex-start;gap:8px}








.gch .gch-panel:is([data-kind="about"],[data-kind="guide"]) .gch-menu-group>a.gch-page-link::before{content:"";display:block;box-sizing:border-box;flex:0 0 6px;width:6px;height:6px;margin-top:calc(.7em - 3px);border:1px solid var(--gch-green);transform:rotate(45deg);opacity:.65}








.gch .gch-panel:is([data-kind="about"],[data-kind="guide"]) .gch-menu-group>a.gch-page-link>.gch-label{flex:1 1 0;min-width:0}

















/* 店舗・通販の区分見出しだけを強め、通常リンクとの階層を明確にする。 */








.gch .gch-panel:is([data-kind="about"],[data-kind="guide"]) .gch-menu-group .gch-subheading{font-weight:600!important}

















/* ログイン後の会員設定は、既存detailsの開閉状態を細線矢印で示す。 */








.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings>summary{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;min-height:44px;padding:10px 32px;list-style:none;border:1px solid #D5A341;border-radius:3px;background:#F2BE55;color:inherit}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings>summary::-webkit-details-marker{display:none}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings>summary::after{content:"";position:absolute;right:14px;top:50%;display:block;box-sizing:border-box;width:8px;height:8px;margin-top:-4px;border-right:1.5px solid var(--gch-green);border-bottom:1.5px solid var(--gch-green);transform:rotate(45deg)}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings[open]>summary::after{transform:rotate(225deg)}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings>summary:focus-visible{outline:2px solid var(--gch-green);outline-offset:2px}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings>summary:hover{background:#EAB248;border-color:#C99635}

















/* 会員の実リンクにも細線の菱形。緑のマイページボタンでは文字と同じ白を使う。 */








.gch.gch-logged .gch-panel[data-kind="account"] .gch-account-links a.gch-link{gap:8px}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-account-links a.gch-link::before{content:"";display:block;box-sizing:border-box;flex:0 0 6px;width:6px;height:6px;border:1px solid var(--gch-link-color,var(--gch-green));transform:rotate(45deg);opacity:.65}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings>a.gch-link{align-items:flex-start}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings>a.gch-link::before{margin-top:calc(.825em - 3px);border-color:var(--gch-green)}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-account-links a.gch-link>.gch-label{min-width:0}

















/* お知らせ：記事を選ぶまで現在のページに留まる、日付とタイトル中心の一覧。 */








.gch .gch-panel[data-kind="news"]{right:auto}








.gch .gch-news-list{display:flex;flex-direction:column}








.gch .gch-news-article{display:flex;flex-direction:column;gap:6px;min-width:0;padding:18px 2px;text-decoration:none;border-bottom:1px solid var(--gch-line);color:var(--gch-ink);overflow-wrap:anywhere}








.gch .gch-news-date{font-size:12px;line-height:1.4;color:#716b61;font-variant-numeric:tabular-nums}








.gch .gch-news-title{font-size:16px;font-weight:600;line-height:1.6}








.gch .gch-news-excerpt{font-size:13px;font-weight:400;line-height:1.7;color:#716b61;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}








.gch .gch-news-article:hover .gch-news-title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}








.gch .gch-news-article:focus-visible{outline:2px solid var(--gch-green);outline-offset:-2px}








.gch .gch-news-status{margin:12px 0 20px;font-size:14px;line-height:1.8}








.gch .gch-news-overview{display:flex;justify-content:flex-end;margin-top:12px}








.gch .gch-news-overview a.gch-page-link{width:auto;min-width:110px}








@media(max-width:1100px){.gch .gch-panel[data-kind="news"]{display:flex;flex-direction:column;overflow:hidden;padding:0}}








@media(max-width:600px){.gch .gch-news-article{padding:15px 2px}.gch .gch-news-title{font-size:15px}}

















/* スマホは注文と案内メニューへ集約。広い画面は4カテゴリを常時表示。 */








.gch .gch-mobile-entry{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:10px 6px;text-align:left;border-bottom:1px solid var(--gch-line);border-radius:0}








.gch .gch-mobile-entry .gch-icon{width:20px;height:20px}.gch .gch-mobile-entry svg{width:20px;height:20px}








.gch .gch-menu-close{display:block;width:100%;min-height:48px;margin-top:12px;border-top:1px solid var(--gch-line);text-align:center}








.gch .gch-panel[data-kind="mobilemenu"]{max-height:calc(100dvh - 160px);overflow:auto}








@media(min-width:601px) and (max-width:1100px){








 .gch.gch-ghost .gch-bar{gap:12px;padding-left:16px;padding-right:16px}








 .gch.gch-ghost .gch-nav{gap:14px}








 .gch.gch-ghost .gch-nav-button,.gch.gch-ghost .gch-news{font-size:14px}








 .gch.gch-ghost .gch-menu-icon,.gch.gch-ghost .gch-menu-icon svg,.gch.gch-ghost .gch-leaf{width:16px;height:16px}








 .gch.gch-ghost .gch-tools{gap:0}








 .gch.gch-ghost .gch-tool,.gch.gch-ghost .gsp-trigger{min-width:40px;width:40px;padding:8px}








}








@media(max-width:600px){








 .gch .gch-nav [data-gch-panel="about"],.gch .gch-nav [data-gch-panel="guide"],.gch .gch-nav .gch-news{display:none}








 .gch:not(.gch-ghost) .gch-nav{grid-template-columns:minmax(0,1fr) auto;gap:0 12px}








 .gch:not(.gch-ghost) .gch-nav [data-gch-panel="order"]{grid-column:1;grid-row:1}








 .gch .gch-mobile,.gch:not(.gch-ghost) .gch-mobile{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:6px 4px;white-space:nowrap;font-size:13px}








 .gch:not(.gch-ghost) .gch-mobile{grid-column:2;grid-row:1}








 .gch .gch-mobile svg{width:20px;height:20px}








 .gch.gch-ghost .gch-nav{gap:4px;justify-content:space-between}








 .gch.gch-ghost .gch-mobile{flex-direction:column;gap:0;min-width:44px;padding:2px}








 .gch.gch-ghost .gch-mobile-label{font-size:9px;line-height:1.2}








 .gch.gch-ghost .gch-tools>[data-gcm-search-root],.gch.gch-ghost .gch-tools>.gsp-host{display:inline-flex}








 .gch.gch-ghost .gch-panel[data-kind="mobilemenu"]{max-height:calc(100dvh - 70px)}








}








@media(min-width:601px) and (max-width:743px){








 .gch.gch-ghost .gch-bar{gap:8px;padding-left:12px;padding-right:12px}








 .gch.gch-ghost .gch-nav{gap:8px}








 .gch.gch-ghost .gch-nav-button,.gch.gch-ghost .gch-news{font-size:12px}








 .gch.gch-ghost .gch-nav .gch-menu-icon{display:none}








}








@media(max-width:600px){








 .gch.gch-ghost .gch-bar{padding-left:6px;padding-right:6px;gap:2px}








 .gch.gch-ghost .gch-seal{width:40px;flex-basis:40px}








 .gch.gch-ghost .gch-seal img{width:34px;height:34px}








 .gch.gch-ghost .gch-nav{gap:2px}








 .gch.gch-ghost .gch-mobile{min-width:36px}








 .gch.gch-ghost .gch-tool,.gch.gch-ghost .gsp-trigger,.gch.gch-ghost .gch-cart{width:40px;min-width:40px;padding:8px}








}








/* アイコンと文字を一つのカテゴリとして読み取りやすくする。 */








.gch .gch-nav .gch-nav-button,.gch .gch-nav .gch-news{gap:2px;letter-spacing:-.02em}








.gch .gch-nav-text{letter-spacing:inherit}








.gch .gch-menu-icon,.gch .gch-menu-icon svg{width:19px;height:19px;color:inherit}








.gch .gch-mobile-entry{gap:6px;letter-spacing:-.02em}








.gch .gch-mobile-entry .gch-icon,.gch .gch-mobile-entry svg{width:22px;height:22px;color:inherit}








@media(min-width:601px) and (max-width:1100px){








 .gch.gch-ghost .gch-menu-icon,.gch.gch-ghost .gch-menu-icon svg,.gch.gch-ghost .gch-leaf{width:18px;height:18px}








}








@media(max-width:600px){








 .gch:not(.gch-ghost) .gch-leaf{width:16px;height:16px}








.gch.gch-ghost .gch-leaf{width:20px;height:20px}








}

















/* ==================================================








   共通見出し：明朝体・白抜き・茶葉色グラデーション帯








   HTML: h2/h3.guricha-heading > span.guricha-heading__text








   ================================================== */








.guricha-heading {








  box-sizing: border-box;








  position: relative;








  isolation: isolate;








  display: block;








  width: 100%;








  min-width: 0;








  max-width: 100%;








  margin: 0 0 28px;








  padding: 0 20px;








  border: 0;








  border-left: 3px solid #839b5c;








  border-radius: 0;








  background: linear-gradient(90deg, #e6eae3 0%, #f2f4f0 48%, #fafbf9 80%, #fff 100%);








  box-shadow: none;








  color: #5a544b;








  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;








  font-size: 26px;








  font-style: normal;








  font-weight: 600;








  line-height: 1.5;








  letter-spacing: .06em;








  text-align: left;








  text-decoration: none;








  white-space: normal;








  overflow: hidden;








}








.guricha-heading > .guricha-heading__text {








  box-sizing: border-box;








  position: relative;








  z-index: 0;








  display: inline-block;








  min-width: 0;








  max-width: 100%;








  margin: 0 0 0 -1px;








  padding: 16px 34px 16px 18px;








  border: 0;








  background: transparent;








  color: inherit;








  font: inherit;








  letter-spacing: inherit;








  overflow-wrap: anywhere;








}








.guricha-heading > .guricha-heading__text::before {








  content: "";








  position: absolute;








  z-index: -1;








  inset: 0 -20px 0 -10px;








  background: linear-gradient(90deg, rgba(255,255,255,.65), #fff 15%, #fff 70%, rgba(255,255,255,0) 100%);








}








@media (max-width: 600px) {








  .guricha-heading {








    margin-bottom: 24px;








    padding: 0 16px;








    font-size: 22px;








    letter-spacing: .03em;








  }








  .guricha-heading > .guricha-heading__text {








    padding: 14px 26px 14px 14px;








  }








  .guricha-heading > .guricha-heading__text::before {








    right: -12px;








  }








}

















/* 承認済み7色：共通ヘッダーのパネル内だけ。寸法・動作は維持。 */








.gch .gch-panel{--gch-panel-bg:#f7f4ed;--gch-soft:#f7f4ed;--gch-green:#66a73b;background:#f7f4ed}








.gch .gch-panel a.gch-link{--gch-link-color:#66a73b}








.gch .gch-panel a.gch-category-link{--gch-link-color:#3f3732}








.gch .gch-panel .gch-heading,.gch .gch-panel .gch-subheading{color:#3f3732}

















/* 高級茶葉 / 高級ティーバッグを折りたたみ、商品は最大3列 */








.gch .gch-product-family{grid-column:1/-1;min-width:0;border-bottom:1px solid var(--gch-line)}








.gch .gch-family-button{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:10px 12px;list-style:none;cursor:pointer;color:var(--gch-ink);background:var(--gch-soft);border-radius:3px}








.gch .gch-family-button::-webkit-details-marker{display:none}








.gch .gch-family-title{margin:0;padding:0;border:0;font-family:inherit;font-weight:600;font-size:15px;line-height:1.5;color:var(--gch-ink)}








.gch .gch-family-button[aria-expanded="true"] .gch-arrow::before,.gch .gch-product-family[open]>.gch-family-button .gch-arrow::before{content:'−'}








.gch .gch-family-button:focus-visible{outline:2px solid var(--gch-green);outline-offset:2px}








.gch .gch-family-content{min-width:0;padding:6px 4px 14px}








.gch .gch-product-family:not([open])>.gch-family-content{display:none}








.gch .gch-panel[data-kind="order"] .gch-product-family .gch-product-section .gch-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-left:0}








.gch .gch-product-family .gch-family-overview .gch-link{grid-column:1/-1}








.gch .gch-product-family .gch-subheading{margin:12px 0 4px;padding:8px 4px 0;font-size:14px}








@media(max-width:600px){.gch .gch-panel[data-kind="order"] .gch-product-family .gch-product-section .gch-links{grid-template-columns:repeat(2,minmax(0,1fr))}.gch .gch-product-family .gch-link{gap:5px;padding-left:4px;padding-right:4px}.gch .gch-family-content{padding-left:0;padding-right:0}}








@media(max-width:359px){.gch .gch-panel[data-kind="order"] .gch-product-family .gch-product-section .gch-links{grid-template-columns:1fr}}

















/* 展開前の中カテゴリと、茶葉 / ティーバッグの階層を区別 */








.gch .gch-panel[data-kind="order"] .gch-categories>.gch-category{padding:3px 0;border-bottom:1px solid rgba(63,55,50,.12)}








.gch .gch-panel[data-kind="order"] .gch-category-button,.gch .gch-panel[data-kind="order"] a.gch-category-link{min-height:52px;padding:12px 14px;background:#fff;font-weight:600!important;line-height:1.5;letter-spacing:.015em;border-radius:3px}








.gch .gch-panel[data-kind="order"] .gch-selected>.gch-category-button{background:#f7f4ed}








.gch .gch-panel[data-kind="order"] .gch-category-button:hover,.gch .gch-panel[data-kind="order"] a.gch-category-link:hover{background:#f7f4ed}








.gch .gch-family-button{display:grid;grid-template-columns:22px minmax(0,1fr) 24px;gap:8px;background:#f7f4ed;padding:10px 12px;text-align:left}








.gch .gch-family-icon{display:block;width:22px;height:22px;object-fit:contain}








.gch .gch-family-title{font-weight:500}








@media(max-width:600px){.gch .gch-panel[data-kind="order"] .gch-category-button,.gch .gch-panel[data-kind="order"] a.gch-category-link{min-height:48px;padding:10px 12px;font-size:15px}.gch .gch-family-button{min-height:46px;grid-template-columns:20px minmax(0,1fr) 24px;gap:7px;padding:9px 10px}.gch .gch-family-icon{width:20px;height:20px}.gch .gch-family-title{font-size:14px}}

















/* PCの右側商品エリアに内側余白を確保 */








@media(min-width:1101px){








 .gch:not(.gch-accordion) .gch-panel[data-kind="order"] .gch-content{padding:16px 20px 20px;gap:12px}








 .gch:not(.gch-accordion) .gch-panel[data-kind="order"] .gch-family-content{padding:8px 12px 16px}








}

















/* 茶葉 / ティーバッグ一覧は上部の商品一覧と同じ短い下線 */








.gch .gch-family-overview a.gch-link{position:relative;width:fit-content;max-width:100%;min-height:48px;padding:10px 0;font-size:15px;font-weight:400!important;border:0;box-shadow:none;background:transparent;border-radius:0;margin:0}








.gch .gch-family-overview a.gch-link>.gch-label{position:relative;display:block;line-height:1.4;padding-bottom:3px}








.gch .gch-family-overview a.gch-link>.gch-label::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:1px;background:var(--gch-green);transition:width .22s}








.gch .gch-family-overview a.gch-link:hover>.gch-label::after,.gch .gch-family-overview a.gch-link:focus-visible>.gch-label::after,.gch .gch-family-overview a.gch-link:active>.gch-label::after{width:100%}








.gch .gch-family-overview a.gch-link:is(:hover,:active){background:transparent}








.gch .gch-family-overview a.gch-link :is(.gch-photo,.gch-photos,.gch-product-icon){display:none}








@media(max-width:600px){.gch .gch-family-overview a.gch-link{min-height:44px;padding:8px 0;font-size:14px}}








@media(prefers-reduced-motion:reduce){.gch .gch-family-overview a.gch-link>.gch-label::after{transition:none}}

















/* 展開中の茶葉 / ティーバッグは中カテゴリと同じ選択表示 */








.gch .gch-panel[data-kind="order"] .gch-family-button[aria-expanded="true"]{background:#f7f4ed;box-shadow:inset 0 0 0 1px #66a73b}








.gch .gch-panel[data-kind="order"] .gch-family-button[aria-expanded="false"]{box-shadow:none}








.gch .gch-panel[data-kind="order"] .gch-family-button:hover{box-shadow:inset 0 0 0 1px #66a73b}

















/* BiNDup：共通フッターを置いた親列だけ旧900px制限を解除 */








#a-footer .column.gcf-bind-column{width:100%!important;max-width:none!important;padding:0!important;margin-left:0!important;margin-right:0!important}








#a-footer .gcf-bind-block{background:#fff!important}








@supports selector(.column:has(> .gcf)){








 #a-footer .column:has(> .gcf){width:100%!important;max-width:none!important;padding:0!important;margin-left:0!important;margin-right:0!important}








 #a-footer .cssskin-_block_footer:has(.gcf){background:#fff!important}








}

















/* 承認済みB案を全ページの共通見出しへ。ブロックIDには依存しない。 */








.guricha-heading{








 position:relative;isolation:isolate;box-sizing:border-box;display:block;width:100%;min-width:0;max-width:100%;








 margin:0 0 24px;padding:16px 16px 12px;border:0;border-radius:0;background:transparent;box-shadow:none;








 color:#3f3732;font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;font-style:normal;








 font-size:28px;font-weight:700;line-height:1.5;letter-spacing:.1em;text-align:left;text-decoration:none;white-space:normal;overflow:visible;








}








.guricha-heading>.guricha-heading__text{position:relative;z-index:1;display:inline-block;box-sizing:border-box;min-width:0;max-width:100%;margin:0;padding:0 6px;border:0;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;overflow-wrap:anywhere}








.guricha-heading>.guricha-heading__text::before{content:"";position:absolute;z-index:-1;inset:58% -14px -1px -4px;border-radius:50% 30% 45% 25%;background:linear-gradient(90deg,rgba(102,167,59,.12),rgba(102,167,59,.065) 75%,transparent)}








.guricha-heading::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:2px;background:linear-gradient(90deg,#c39143 0%,#c39143 70%,rgba(195,145,67,.2) 100%)}








@media(max-width:600px){.guricha-heading{padding:14px 12px 10px;font-size:23px;letter-spacing:.075em;margin-bottom:20px}.guricha-heading::after{left:12px;right:12px}}

















/* FutureShopのパンくずだけ Noto Serif JP Light 300 */








body[class*="fs-body"] :is(.fs-c-breadcrumb,.fs-c-breadcrumb__list,.fs-c-breadcrumb__listItem,.fs-c-breadcrumb a,.fs-c-breadcrumb span,.c-breadcrumb,.c-breadcrumb a,.c-breadcrumb span,.c-breadcrumb em){








 font-family:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif!important;








 font-weight:300!important;








 font-style:normal;








}

















/* 共通フッター：A案（白 × 生成り）。既存本文・ヘッダーには適用しない。 */








.gcf,.gcf *,.gcf *::before,.gcf *::after{box-sizing:border-box}








.gcf{--gcf-ink:#3f3732;--gcf-muted:#675f58;--gcf-green:#66a73b;--gcf-soft:#f7f4ed;--gcf-line:#e4ded2;display:block;width:100%;margin:0;padding:0;background:#fff;color:var(--gcf-ink);font-family:"Noto Sans JP","Yu Gothic",Meiryo,sans-serif;font-size:14px;font-weight:400;line-height:1.7;letter-spacing:normal;text-align:left;border:0;border-top:1px solid var(--gcf-line);isolation:isolate}








.gcf :is(p,h2,ul,li,address,section,details,summary,nav){float:none;text-indent:0;background:none;border:0;box-shadow:none}








.gcf :is(p,h2,ul,li){margin:0;padding:0}








.gcf :is(h2,p,li)::before,.gcf :is(h2,p,li)::after{content:none}








.gcf a,.gcf a:link,.gcf a:visited,.gcf a:hover,.gcf a:active{color:var(--gcf-ink)!important;text-decoration:none!important;font-family:inherit;font-style:normal}








.gcf a:focus-visible,.gcf summary:focus-visible{outline:2px solid var(--gcf-green);outline-offset:4px}








.gcf .gcf-inner{width:100%;max-width:1280px;margin:0 auto;padding:28px 44px 0}








.gcf .gcf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding-bottom:24px}








.gcf .gcf-grid>*{min-width:0}








.gcf .gcf-logo{display:inline-block;max-width:100%}








.gcf .gcf-logo img{display:block;width:205px;height:auto;max-width:100%;margin:0;padding:0;border:0;border-radius:0;box-shadow:none}








.gcf .gcf-tagline{display:none}








.gcf .gcf-intro{font-size:13px;line-height:1.85;color:var(--gcf-muted);margin:0 0 10px}








.gcf .gcf-brand>.gcf-intro{display:none}








.gcf .gcf-company{font-size:13px;line-height:1.85;font-style:normal;color:var(--gcf-muted)}








.gcf .gcf-company strong{display:block;font-size:14px;font-weight:500;color:var(--gcf-ink);margin-bottom:6px}








.gcf .gcf-caption{display:block;font-size:11px;margin-bottom:3px}








.gcf .gcf-store-title{font-size:12px;margin:10px 0 2px;color:var(--gcf-muted)}








.gcf .gcf-store-links{display:flex;flex-wrap:wrap;gap:16px;font-size:13px}








.gcf .gcf-heading,.gcf .gcf-summary{font-family:inherit;font-size:15px;font-weight:600;line-height:1.7;letter-spacing:.03em;margin:0 0 10px;padding:0;color:var(--gcf-ink)}








.gcf .gcf-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:default}








.gcf .gcf-summary::-webkit-details-marker{display:none}








.gcf .gcf-toggle{display:none}








.gcf .gcf-links{list-style:none;padding:0;margin:0}








.gcf .gcf-links li{list-style:none}








.gcf .gcf-text-link{position:relative;display:inline-flex;align-items:center;max-width:100%;padding:6px 0;gap:8px;font-size:14px;line-height:1.7;overflow-wrap:anywhere}








.gcf .gcf-text-link::after{content:"";position:absolute;left:0;bottom:4px;width:22px;height:1px;background:var(--gcf-green);transition:width .22s}








.gcf .gcf-text-link:hover::after,.gcf .gcf-text-link:focus-visible::after{width:100%}








.gcf .gcf-register{display:flex;align-items:center;justify-content:center;min-height:44px;margin:12px 0 0;padding:9px 12px;background:var(--gcf-soft);border:0;border-radius:5px;font-size:14px;font-weight:600;line-height:1.7;text-align:center}








.gcf .gcf-register:hover{box-shadow:inset 0 0 0 1px var(--gcf-green)}








.gcf .gcf-phone{display:block;max-width:100%;font-size:25px;font-weight:500;line-height:1.5;letter-spacing:.02em;white-space:nowrap;margin:4px 0 6px}








.gcf .gcf-hours{font-size:13px;line-height:1.9;color:var(--gcf-muted);margin:0 0 15px}








.gcf .gcf-mail-icon{display:block;flex:0 0 18px;width:18px;height:18px}








.gcf .gcf-mail-note{font-size:11px;line-height:1.8;color:var(--gcf-muted);margin:7px 0 0}








.gcf .gcf-calendar{width:240px;max-width:100%;padding:8px;background:var(--gcf-soft);border-radius:6px}








.gcf .gcf-calendar iframe{display:block;width:100%;height:320px;margin:0;border:0;background:transparent}








.gcf .gcf-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 0 16px;border-top:1px solid var(--gcf-line)}








.gcf .gcf-legal{display:flex;flex-wrap:wrap;gap:10px 18px;min-width:0;font-size:11px;line-height:1.8}








.gcf .gcf-legal a{color:var(--gcf-muted)!important;padding:3px 0}








.gcf .gcf-legal a:hover{text-decoration:underline!important;text-underline-offset:3px}








.gcf .gcf-copyright{font-size:10px;line-height:1.8;color:var(--gcf-muted);margin:0}








@media(min-width:601px) and (max-width:950px){.gcf .gcf-inner{padding:24px 28px 0}.gcf .gcf-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 40px}.gcf .gcf-bottom{align-items:flex-start;flex-direction:column;gap:8px}.gcf .gcf-phone{font-size:27px}}








@media(max-width:600px){








 .gcf .gcf-inner{padding:22px 20px 0}








 .gcf .gcf-grid{grid-template-columns:minmax(0,1fr);gap:0;padding-bottom:12px}








 .gcf .gcf-brand{padding-bottom:18px}








 .gcf .gcf-logo img{width:190px}








 .gcf .gcf-tagline{margin:8px 0 6px;font-size:17px}








 .gcf .gcf-group{border-top:1px solid var(--gcf-line)}








 .gcf .gcf-summary{min-height:52px;margin:0;cursor:pointer}








 .gcf .gcf-toggle{display:block;flex:none;width:24px;height:24px;line-height:24px;text-align:center;font-size:18px;font-weight:400;color:var(--gcf-green)}








 .gcf .gcf-toggle::before{content:'＋'}








 .gcf .gcf-group[open]>.gcf-summary .gcf-toggle::before{content:'−'}








 .gcf .gcf-group-body{padding:0 4px 14px}








 .gcf .gcf-register{max-width:260px}








 .gcf .gcf-contact{padding:16px 0 18px;border-top:1px solid var(--gcf-line)}








 .gcf .gcf-contact .gcf-heading{margin-bottom:8px}








 .gcf .gcf-phone{font-size:28px}








 .gcf .gcf-bottom{align-items:flex-start;flex-direction:column;gap:8px;padding:12px 0 16px}








}








@media(prefers-reduced-motion:reduce){.gcf .gcf-text-link::after{transition:none}}








.gch .gch-panel .gch-arrow{color:#66a73b;border-color:#66a73b}








.gch .gch-panel .gch-close{color:#66a73b}








.gch .gch-panel .gch-selected>.gch-category-button{box-shadow:inset 0 0 0 1px #66a73b}








.gch .gch-panel .gch-category-button:hover,.gch .gch-panel .gch-category-link:hover{box-shadow:inset 0 0 0 1px #66a73b}








.gch .gch-panel .gch-account-links>a.gch-link:first-child{--gch-link-color:white;background:#66a73b}








.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings>summary,.gch.gch-logged .gch-panel[data-kind="account"] .gch-settings>summary:hover{background:#f7f4ed;border-color:#66a73b}








.gch .gch-panel .gch-menu-group a.gch-page-link:is([href="https://www.guricha.co.jp/onlineshopping-Members/onlineshopping-benefits.html"],[href="https://www.guricha.co.jp/onlineshopping-Members/onlineshopping-info2.html#pointcoupn"])::before{border-color:#c39143;opacity:1}








.gch .gch-panel a[href="https://www.guricha.co.jp/p/logout"]{--gch-link-color:#b7282e;border-color:#b7282e}

















/* 2026-10-11 BiNDupテストページ「お知らせ」見出し */








#bk102276435 .guricha-heading{








  margin:0 0 24px;








  padding:0 16px;








  border-left:4px solid #66a73b;








  background:linear-gradient(90deg,#f7f4ed 0%,rgba(247,244,237,.8) 55%,rgba(247,244,237,0) 100%);








  color:#3f3732;








  font-size:28px; font-weight:600; line-height:1.5; letter-spacing:.07em;








}








#bk102276435 .guricha-heading > .guricha-heading__text{








  margin:0; padding:12px 24px 12px 16px;








}








#bk102276435 .guricha-heading > .guricha-heading__text::before{








  inset:0 -16px 0 -8px;








  background:linear-gradient(90deg,rgba(255,255,255,.25) 0%,#fff 14%,#fff 70%,rgba(255,255,255,0) 100%);








}








@media(max-width:600px){








  #bk102276435 .guricha-heading{padding:0 10px;font-size:23px;letter-spacing:.04em;margin-bottom:20px;}








  #bk102276435 .guricha-heading > .guricha-heading__text{padding:10px 20px 10px 12px;}








}

















/* 2026-10-11 お知らせ：生成りと淡い萌葱の柔らかな和風表現 */








#bk102276435 .guricha-heading{








  border-left:0;








  padding-left:20px;








  border-radius:4px 16px 16px 4px;








  background:linear-gradient(100deg,rgba(102,167,59,.065) 0%,rgba(247,244,237,.92) 17%,rgba(247,244,237,.58) 52%,rgba(247,244,237,.15) 82%,rgba(247,244,237,0) 100%);








  font-weight:500;








  letter-spacing:.1em;








}








#bk102276435 .guricha-heading > .guricha-heading__text{








  padding-top:14px;padding-bottom:14px;








}








#bk102276435 .guricha-heading > .guricha-heading__text::before{








  inset:4px -28px 4px -18px;








  border-radius:50%;








  background:radial-gradient(ellipse at center,rgba(255,255,255,.98) 0%,rgba(255,255,255,.83) 46%,rgba(255,255,255,.3) 70%,rgba(255,255,255,0) 100%);








}








@media(max-width:600px){








  #bk102276435 .guricha-heading{padding-left:14px;letter-spacing:.075em;}








  #bk102276435 .guricha-heading > .guricha-heading__text{padding-top:12px;padding-bottom:12px;}








}

















/* 2026-10-11 承認済みB案：線2px、左70%が黄土100%、右端20% */








#bk102276435 .guricha-heading{








  position:relative; isolation:isolate; box-sizing:border-box;








  margin:0 0 24px; padding:16px 16px 20px;








  border:0; border-radius:0; background:transparent;








  color:#3f3732; font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;








  font-size:28px; font-weight:500; line-height:1.5; letter-spacing:.1em;








}








#bk102276435 .guricha-heading > .guricha-heading__text{








  position:relative; z-index:1; display:inline-block; box-sizing:border-box;








  max-width:100%; margin:0; padding:0 6px; border:0;








  background:transparent; color:inherit; font:inherit;








}








#bk102276435 .guricha-heading > .guricha-heading__text::before{








  content:""; position:absolute; z-index:-1;








  inset:58% -14px -1px -4px;








  border-radius:50% 30% 45% 25%;








  background:linear-gradient(90deg,rgba(102,167,59,.12),rgba(102,167,59,.065) 75%,transparent);








}








#bk102276435 .guricha-heading::after{








  content:""; position:absolute; left:16px; right:16px; bottom:0;








  height:2px;








  background:linear-gradient(90deg,#c39143 0%,#c39143 70%,rgba(195,145,67,.2) 100%);








}








@media(max-width:600px){








 #bk102276435 .guricha-heading{padding:14px 12px 18px;font-size:23px;letter-spacing:.075em;margin-bottom:20px;}








 #bk102276435 .guricha-heading::after{left:12px;right:12px;}








}

















/* 2026-10-11 B案：明朝700、文字と線の間隔を調整 */








#bk102276435 .guricha-heading{font-weight:700;padding-bottom:12px;}








@media(max-width:600px){#bk102276435 .guricha-heading{padding-bottom:10px;}}

















/* 中カテゴリを開いた内側は白、外側は生成り。小カテゴリ文字は通常色。 */








.gch .gch-panel[data-kind="order"]{background:#f7f4ed;}








.gch .gch-panel[data-kind="order"] .gch-content{








  background:#ffffff; border-radius:3px;








}








.gch .gch-panel[data-kind="order"] .gch-content a.gch-link{








  --gch-link-color:#3f3732;








}

















/* 2026-10-11 萌黄・茜色。明るい萌黄の上は濃い文字で表示。 */








.gch .gch-count,.gch-logged [data-gch-panel="account"] .gch-icon,.gch-logged .gch-check{color:#3f3732;}








.gch .gch-panel .gch-account-links>a.gch-link:first-child{--gch-link-color:#3f3732;}








.gch .gch-search button{color:#3f3732;}

















/* 2026-10-11 ドロップダウンのリンク文字は通常色。アイコン色は維持。 */








.gch .gch-panel a.gch-link .gch-label{color:#3f3732!important;}

















/* 2026-10-11 数量バッジは太字、ログイン表示は白。 */








.gch .gch-count{font-weight:700;}








.gch.gch-logged [data-gch-panel="account"] .gch-icon,.gch.gch-logged .gch-check{color:#ffffff;}








.gch .gch-panel .gch-account-links>a.gch-link:first-child[href^="https://www.guricha.co.jp/p/login"] .gch-label{color:#ffffff!important;}

















/* 2026-10-11 カート数量バッジの数字も白。 */








.gch .gch-count{color:#ffffff;}

















/* 2026-10-12 採用：白主体・澄んだお茶の黄緑。背景だけを左から右へ。 */








.gch .gch-header{overflow:hidden;background:#ffffff!important}.gch .gch-header:before,.gch .gch-header:after{content:"";position:absolute;inset:0;pointer-events:none;background-repeat:no-repeat}








.gch .gch-header:before{background-image:radial-gradient(ellipse clamp(360px,45vw,760px) 180px at 44% 62%,#c9df8a 0%,#eef3d8 38%,#ffffff00 88%),radial-gradient(ellipse clamp(320px,38vw,680px) 160px at 58% 35%,#c9df8a 0%,#eef3d8 38%,#ffffff00 88%),radial-gradient(ellipse clamp(220px,28vw,460px) 130px at 68% 18%,#eaf3f6 0%,#ffffff00 82%);animation:gch-tea-flow 10s linear infinite;background-size:220% 150%;background-position:100% 50%}








.gch .gch-header:after{background-image:radial-gradient(ellipse at 50% 65%,#ffffff00 0 18%,#ffffffdc 29%,#ffffff00 43%);background-size:220% 200%;animation:gch-tea-light-flow 13s linear infinite;opacity:.7}








.gch .gch-bar{position:relative;z-index:1}.gch .gch-header:has(.gch-panel:not([hidden])){overflow:visible}








@keyframes gch-tea-flow{0%{background-position:100% 45%;opacity:0}12%{opacity:1}50%{background-position:50% 58%;opacity:1}88%{opacity:1}100%{background-position:0% 45%;opacity:0}}








@keyframes gch-tea-light-flow{0%{background-position:100% 42%;opacity:0}15%{opacity:.8}50%{background-position:50% 60%;opacity:.95}85%{opacity:.8}100%{background-position:0% 42%;opacity:0}}








.gch.gch-ghost .gch-header{background:#fff!important}.gch.gch-ghost .gch-header:before{display:block;filter:opacity(.7)}.gch.gch-ghost .gch-header:after{filter:opacity(.85)}








@media(prefers-reduced-motion:reduce){.gch .gch-header:before,.gch .gch-header:after{animation:none}}

















/* 2026-10-12 雲のように流れる広いグラデーション。配色・周期は維持。 */

















/* 2026-10-12 iPad mini縦向き（744px）からフッター4列。カレンダーの実幅を確保。 */








@media(min-width:744px) and (max-width:1100px){








 .gcf .gcf-inner{padding:24px 16px 0}








 .gcf .gcf-grid{grid-template-columns:repeat(2,minmax(0,1fr)) minmax(216px,1.15fr);gap:14px;padding-bottom:24px}








 .gcf .gcf-logo img{width:175px}








 .gcf .gcf-tagline{font-size:16px}








 .gcf .gcf-summary,.gcf .gcf-heading{font-size:14px;letter-spacing:0}








 .gcf .gcf-phone{font-size:19px;letter-spacing:0}








 .gcf .gcf-calendar{width:100%;max-width:240px}








}



































/* 2026-10-12 4列フッター：列間の中央に、細い温かみのある区切り。 */








@media(min-width:744px){








 .gcf .gcf-grid>*{position:relative}








 .gcf .gcf-grid>*+*::before{content:"";position:absolute;left:-14px;top:4px;bottom:0;width:1px;background:#d9d1c2;pointer-events:none}








}








@media(min-width:744px) and (max-width:1100px){








 .gcf .gcf-grid>*+*::before{left:-7px}








}

















/* 2026-10-12 BiNDupトップ：指定の写真・紹介ブロックを含むエリアだけ背景を拡張。 */








#a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title){position:relative;isolation:isolate;background:#fff!important}








#a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)::before,








#a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)::after{








 content:"";display:block;position:absolute;inset:0;width:100%;height:100%;clear:none;float:none;box-sizing:border-box;z-index:0;pointer-events:none;background-repeat:no-repeat;








}








#a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)::before{








 background-image:radial-gradient(ellipse clamp(480px,65vw,1100px) clamp(240px,40vh,440px) at 44% 34%,#c9df8a 0%,#eef3d8 38%,#ffffff00 88%),radial-gradient(ellipse clamp(420px,55vw,950px) clamp(220px,36vh,400px) at 58% 74%,#c9df8a 0%,#eef3d8 38%,#ffffff00 88%),radial-gradient(ellipse clamp(300px,36vw,640px) clamp(180px,30vh,320px) at 68% 20%,#eaf3f6 0%,#ffffff00 82%);








 background-size:220% 130%;background-position:100% 50%;animation:gbi-cloud-flow 10s linear infinite;








}








#a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)::after{








 background-image:radial-gradient(ellipse at 50% 65%,#ffffff00 0 18%,#ffffffdc 29%,#ffffff00 43%);








 background-size:220% 180%;animation:gbi-cloud-light 13s linear infinite;








}








#a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)>.site_frame{position:relative;z-index:1;background:transparent!important}








#a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title) :is(.cssskin-_block_billboard,.cssskin-index-title),








#a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title) :is(.cssskin-_block_billboard,.cssskin-index-title)>.column{background:transparent!important}








@keyframes gbi-cloud-flow{0%{background-position:100% 45%;opacity:0}12%{opacity:1}50%{background-position:50% 58%;opacity:1}88%{opacity:1}100%{background-position:0% 45%;opacity:0}}








@keyframes gbi-cloud-light{0%{background-position:100% 42%;opacity:0}15%{opacity:.8}50%{background-position:50% 60%;opacity:.95}85%{opacity:.8}100%{background-position:0% 42%;opacity:0}}








@media(prefers-reduced-motion:reduce){








 #a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)::before,








 #a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)::after{animation:none;background-position:50% 50%}








}

















/* 2026-10-12 BiNDup：通常ヘッダーとビルボードを一枚の背景でつなぐ。 */








.gch-top-scene{position:relative;isolation:isolate}








.gch-top-scene>.gch-top-backdrop{position:absolute;left:0;right:0;z-index:-1;pointer-events:none;background:#fff;overflow:hidden}








.gch-top-backdrop::before,.gch-top-backdrop::after{content:"";display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none;background-repeat:no-repeat}








.gch-top-backdrop::before{








 background-image:radial-gradient(ellipse clamp(480px,65vw,1100px) clamp(240px,40vh,440px) at 44% 34%,#c9df8a 0%,#eef3d8 38%,#ffffff00 88%),radial-gradient(ellipse clamp(420px,55vw,950px) clamp(220px,36vh,400px) at 58% 74%,#c9df8a 0%,#eef3d8 38%,#ffffff00 88%),radial-gradient(ellipse clamp(300px,36vw,640px) clamp(180px,30vh,320px) at 68% 20%,#eaf3f6 0%,#ffffff00 82%);








 background-size:220% 130%;background-position:100% 50%;animation:gbi-cloud-flow 10s linear infinite;








}








.gch-top-backdrop::after{background-image:radial-gradient(ellipse at 50% 65%,#ffffff00 0 18%,#ffffffdc 29%,#ffffff00 43%);background-size:220% 180%;animation:gbi-cloud-light 13s linear infinite}








.gch-top-scene #a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title){background:transparent!important}








.gch-top-scene #a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)::before,








.gch-top-scene #a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)::after{display:none}








.gch-top-scene #a-header,








.gch-top-scene #a-header>.site_frame,








.gch-top-scene #a-header .b-plain:has([data-guricha-header]),








.gch-top-scene #a-header .column:has([data-guricha-header]){background:transparent!important}








.gch.gch-top-joined:not(.gch-ghost) .gch-header{background:transparent!important}








.gch.gch-top-joined:not(.gch-ghost) .gch-header::before,








.gch.gch-top-joined:not(.gch-ghost) .gch-header::after{visibility:hidden}








@media(prefers-reduced-motion:reduce){.gch-top-backdrop::before,.gch-top-backdrop::after{animation:none;background-position:50% 50%}}

















/* 2026-10-12 淡い水色 #eaf3f6 を雲の端へ追加。既存の黄緑・周期・範囲は維持。 */








/* 親カテゴリ：明朝体。ホバー・選択中も透明な背景と中カテゴリと同じ緑の線。 */








.gch .gch-nav>:is(.gch-nav-button,.gch-news),








[data-guricha-header]:not(.gch) .gch-static-navigation>details>summary.gch-nav-button,








[data-guricha-header]:not(.gch) .gch-static-navigation>.gch-news{








 position:relative;background:transparent!important;border-radius:3px;








 font-family:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif!important;font-weight:700!important;








}








.gch .gch-nav>:is(.gch-nav-button,.gch-news)::after,








[data-guricha-header]:not(.gch) .gch-static-navigation>details>summary.gch-nav-button::after,








[data-guricha-header]:not(.gch) .gch-static-navigation>.gch-news::after{








 content:"";position:absolute;inset:2px -6px;border-radius:3px;pointer-events:none;








 box-shadow:inset 0 0 0 1px #66a73b;opacity:0;transition:opacity .18s ease;








}








.gch .gch-nav>:is(.gch-nav-button,.gch-news):is(:hover,:focus-visible,[aria-expanded="true"])::after,








[data-guricha-header]:not(.gch) .gch-static-navigation>details>summary.gch-nav-button:is(:hover,:focus-visible)::after,








[data-guricha-header]:not(.gch) .gch-static-navigation>details[open]>summary.gch-nav-button::after,








[data-guricha-header]:not(.gch) .gch-static-navigation>.gch-news:is(:hover,:focus-visible)::after{opacity:1}








.gch .gch-nav>:is(.gch-nav-button,.gch-news):focus-visible{outline:0}








@media(prefers-reduced-motion:reduce){.gch .gch-nav>:is(.gch-nav-button,.gch-news)::after{transition:none}}

















/* 旧埋め込みHTMLも、共通フッターを3列構成へ移行。 */








.gcf .gcf-grid>details:has(nav[aria-label="通販のご案内"]){display:none}








.gcf .gcf-company{margin-top:12px}

















/* 3列のまとまりは中央、各列の文字は左揃え。 */








.gcf .gcf-grid>*{text-align:left}








.gcf .gcf-contact>.gcf-intro{display:none}








@media(min-width:744px){








 .gcf .gcf-grid{grid-template-columns:repeat(3,minmax(0,240px));justify-content:center}








}

















/* PCのお徳用ティーバッグ：素材ごとに段を分け、商品を高級茶葉と同じ最大3列で表示。 */








@media(min-width:1101px){








 .gch:not(.gch-accordion) .gch-panel[data-kind="order"] .gch-content[aria-label="お徳用ティーバッグ"]{grid-template-columns:minmax(0,1fr);gap:8px}








 .gch:not(.gch-accordion) .gch-panel[data-kind="order"] .gch-content[aria-label="お徳用ティーバッグ"]>.gch-links{grid-template-columns:minmax(0,1fr)}








 .gch:not(.gch-accordion) .gch-panel[data-kind="order"] .gch-content[aria-label="お徳用ティーバッグ"]>.gch-product-section .gch-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-left:0}








}

















/* 商品リンク：親カテゴリと同じ緑の細い枠線。背景は透明で配置を動かさない。 */








.gch .gch-panel[data-kind="order"] .gch-product-section:not(.gch-family-overview) .gch-links>a.gch-link{position:relative;border-radius:3px;background:transparent}








.gch .gch-panel[data-kind="order"] .gch-product-section:not(.gch-family-overview) .gch-links>a.gch-link::after{content:"";position:absolute;inset:2px 0;border-radius:3px;pointer-events:none;box-shadow:inset 0 0 0 1px #66a73b;opacity:0;transition:opacity .18s ease}








.gch .gch-panel[data-kind="order"] .gch-product-section:not(.gch-family-overview) .gch-links>a.gch-link:is(:hover,:focus-visible,:active){background:transparent;outline:0}








.gch .gch-panel[data-kind="order"] .gch-product-section:not(.gch-family-overview) .gch-links>a.gch-link:is(:hover,:focus-visible,:active)::after{opacity:1}








@media(prefers-reduced-motion:reduce){.gch .gch-panel[data-kind="order"] .gch-product-section:not(.gch-family-overview) .gch-links>a.gch-link::after{transition:none}}

















/* BiNDupの a:hover {opacity:.4} を共通ヘッダー内だけ無効化。枠線のフェードは維持。 */








.gch a,.gch a img,[data-guricha-header]:not(.gch) a,[data-guricha-header]:not(.gch) a img{opacity:1!important}

















/* 2026-10-16 作成済みビルボードの共通背景。








   色と動きは既存の共通レイヤー1枚を使用。ページ別の画像・目次の配置は保持。 */








html body #a-billboard:has(:is([data-guricha-about="billboard"],[data-guricha-leaf="billboard"],[data-guricha-premium="billboard"],[data-guricha-valuepack="billboard"],[data-guricha-seasons="billboard"])){








 padding-bottom:clamp(36px,4vw,64px)!important;








}








.gch-top-scene:has(#a-billboard :is(#guricha-home-hero,[data-guricha-about="billboard"],[data-guricha-leaf="billboard"],[data-guricha-premium="billboard"],[data-guricha-valuepack="billboard"],[data-guricha-seasons="billboard"]))>.gch-top-backdrop{








 -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);








 mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);








}

















/* Mobile scrolled header: group order beside the menu, away from the seal. */








@media(max-width:600px){.gch.gch-ghost .gch-nav{justify-content:flex-end;gap:12px}.gch.gch-ghost .gch-nav>[data-gch-panel="order"]{flex:0 0 auto}.gch.gch-ghost .gch-mobile{flex:0 0 40px}}








@media(max-width:359px){.gch.gch-ghost .gch-nav{gap:4px}.gch.gch-ghost .gch-nav>[data-gch-panel="order"]{font-size:12px}.gch.gch-ghost .gch-mobile{flex-basis:36px;width:36px;min-width:36px}}














/* Main navigation: same motion for hover, keyboard focus and an open touch menu. */





@media(prefers-reduced-motion:no-preference){





 .gch .gch-nav>:is(.gch-nav-button,.gch-news)>:is(.gch-leaf,.gch-menu-icon){transform:translateY(0) scale(1);transform-origin:center;transition:transform .4s ease}





 .gch .gch-nav>:is(.gch-nav-button,.gch-news):is([aria-expanded="true"],:focus-visible)>:is(.gch-leaf,.gch-menu-icon){transform:translateY(-4px) scale(1.08)}





}





@media(any-hover:hover) and (prefers-reduced-motion:no-preference){





 .gch .gch-nav>:is(.gch-nav-button,.gch-news):hover>:is(.gch-leaf,.gch-menu-icon){transform:translateY(-4px) scale(1.08)}





}








/* 2026-10-21 White base, pale moving tea clouds shared by all platforms. */


.gch-top-scene>.gch-top-backdrop{background:#fff!important;-webkit-mask-image:linear-gradient(#000 calc(100% - 80px),transparent)!important;mask-image:linear-gradient(#000 calc(100% - 80px),transparent)!important}


.gch-top-backdrop::before,.gch .gch-header::before,#a-billboard:has(.cssskin-_block_billboard):has(.cssskin-index-title)::before{


 background-image:radial-gradient(ellipse at 34% 32%,#c9df8a 0%,#eef3d8 28%,#ffffff00 60%),radial-gradient(ellipse at 66% 70%,#c9df8a 0%,#eef3d8 26%,#ffffff00 58%),radial-gradient(ellipse at 80% 15%,#cddfe9 0%,#ffffff00 45%);


 background-size:120% 110%;animation:guricha-pale-flow 12s ease-in-out infinite;


}


.gch-top-backdrop::after,.gch .gch-header::after{opacity:.35;animation:guricha-pale-light 15s ease-in-out infinite}


@keyframes guricha-pale-flow{0%,100%{background-position:20% 35%;opacity:.55}50%{background-position:80% 65%;opacity:.85}}


@keyframes guricha-pale-light{0%,100%{background-position:20% 40%;opacity:.15}50%{background-position:80% 60%;opacity:.35}}


.gch-top-scene #a-billboard{background:transparent!important}


.gch-top-scene #a-billboard>.site_frame{position:relative;z-index:1}


@media(prefers-reduced-motion:reduce){.gch-top-backdrop::before,.gch-top-backdrop::after,.gch .gch-header::before,.gch .gch-header::after{animation:none;background-position:50% 50%}}


/* FutureShop product photo viewer: keep its close control above the ghost header. */


body:has(.fs-c-productImageModal:not([style*="display: none"]):not([style*="display:none"])) .gch.gch-ghost {


  visibility: hidden !important;


  pointer-events: none !important;


}


/* Login: let the existing header background continue under the service bar. */


#fs_Login #guricha-fs-service-bar { background: transparent; }





/* Login: continue the existing header background under the service bar. */


#fs_Login #guricha-fs-service-bar { background: transparent; }





/* FutureShop navigation: news is provided below the header. */


.fs-l-header .gch [data-gch-panel="news"]{display:none!important}











/* Product list is the primary repeat-shopping entrance; guides are secondary. */
.gch .gch-panel[data-kind="order"] .gch-overview{display:grid;grid-template-columns:max-content max-content;justify-content:start;align-items:stretch;gap:9px 10px;margin-top:18px;margin-bottom:9px;padding:0}
.gch .gch-panel[data-kind="order"] .gch-overview a{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 12px;background:#f0f1e9!important;border:1px solid #d5dbc9;border-radius:6px;box-shadow:none!important;font-size:13px;font-weight:400!important;line-height:1.5;--gch-link-color:#424a38}
.gch .gch-panel[data-kind="order"] .gch-overview a .gch-label{text-decoration:none!important;border:0!important}
.gch .gch-panel[data-kind="order"] .gch-overview a.gch-page-link>.gch-label::after{display:none}
.gch .gch-panel[data-kind="order"] .gch-overview a[href="https://www.guricha.co.jp/onlineshop/onlineitems.html"]{grid-column:1/-1;grid-row:1;justify-content:space-between;gap:25px;min-height:43px;padding:10px 14px;background:#e7edda!important;border-color:#bdcba8;font-size:15px;font-weight:500!important;--gch-link-color:#435b32}
.gch .gch-panel[data-kind="order"] .gch-overview a[href="https://www.guricha.co.jp/onlineshop/onlineitems.html"]::after{content:"→";font-size:14px;font-weight:400}
.gch .gch-panel[data-kind="order"] .gch-overview a[href="https://www.guricha.co.jp/f/first"]{grid-column:1;grid-row:2}
.gch .gch-panel[data-kind="order"] .gch-overview a[href="https://www.guricha.co.jp/onlineshop/reviews.html"]{grid-column:2;grid-row:2}
.gch .gch-panel[data-kind="order"] .gch-overview a:hover{background:#e4e9d8!important;border-color:#8da779}
.gch .gch-panel[data-kind="order"] .gch-overview a[href="https://www.guricha.co.jp/onlineshop/onlineitems.html"]:hover{background:#dfe8cf!important}

/* Keep the navigation pale without washing out the billboard below it. */
.gch-top-backdrop::before{
 -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.18) 0,rgba(0,0,0,.42) 40px,#000 80px);
 mask-image:linear-gradient(to bottom,rgba(0,0,0,.18) 0,rgba(0,0,0,.42) 40px,#000 80px);
}
.gch .gch-header::before{
 -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.2),rgba(0,0,0,.4));
 mask-image:linear-gradient(to bottom,rgba(0,0,0,.2),rgba(0,0,0,.4));
}