/* -------------------------------
ページバック
---------------------------------- */
.page-back {
position: fixed;
top: 12rem;
left: 2rem;
width:5rem;
height:5rem;
background:rgba(255,255,255,.6);
backdrop-filter:blur(8px);
-webkit-backdrop-filter:blur(8px);
box-shadow:0 4px 20px rgba(0,0,0,.12);
border-radius:.4rem;
cursor:pointer;
z-index:1000;
display:flex;
align-items:center;
justify-content:center;
transition:
opacity .5s ease,
transform .5s ease,
visibility .5s;
}

.page-back::after{
content:"";
display:block;
width:3.2rem;
height:3.2rem;
background-repeat:no-repeat;
background-position:center;
background-size:contain;
background-image:url('/2026-image/common/chevron_left.svg');
}

.page-back:hover {
transform: translateX(-3px);
}

@media (max-width: 1000px) {
.page-back {
top:12.5rem;
left:1rem;
}
}


/* 下スクロール時 */
.page-back.is-hidden {
transform: translateX(calc(-100%-30px));
opacity: 0;
pointer-events: none;
}


/* -------------------------------
ヘッダー固定
---------------------------------- */
.header-fixed{
position:fixed;
top:0;
left:0;
width:100%;
z-index:1000;
transform:translateY(-15rem);
transition:transform .45s cubic-bezier(.22,1,.36,1);
background:rgba(247,248,250,.5);
backdrop-filter:blur(12px);
-webkit-backdrop-filter:blur(12px);
transition:
opacity .5s ease,
transform .5s ease,
visibility .5s ease;
}

.header-fixed.is-show{
transform:translateY(0);
}


/* -------------------------------
ユーティリティー
---------------------------------- */
.header-utility{
display:block;
padding:0 2rem;
border-bottom:1px solid var(--color-line2);
}

.header-utility__nav{
display:flex;
align-items:center;
justify-content:flex-end;
gap:2.3rem;
border:0px #FF0000 solid;
height:4.5rem;
}

.header-utility__nav a{
display:flex;
align-items:center;
gap:.2rem;
color:var(--color-link1);
text-decoration:none;
letter-spacing:.08rem;
transition:.25s;
}

.header-utility__nav a:hover{
color:var(--color-hover1);
}

.header-utility__nav a img{
width:1.6rem;
}
.header-utility__nav a span:nth-child(1){
padding:0 .4rem 0 0;
}

.header-utility__nav a span:nth-child(2){
font-family:"mincho", serif;
font-size:1.4rem;
}


/* SP */
@media(max-width:800px){
.header-utility{
padding:0 .5rem;
}

.header-utility__nav{
gap:0;
height:5rem;
}

.header-utility__nav a{
flex-direction: column;
align-items: center; /* 縦中央 */
justify-content: center; /* 横中央 */
padding:0 1.5rem;
}
.header-utility__nav a span{
border:0px #FF0000 solid;
}

.header-utility__nav a img{
width:1.8rem;
}

.header-utility__nav a span:nth-child(2){
font-size:1.1rem;
line-height:1.3;
}

}


@media(max-width:500px){
.header-utility__nav{
height:6rem;
}
.header-utility__nav a{
padding:0 1rem;
}
}


/* -------------------------------
メニュー
---------------------------------- */
.site-header{
position:sticky;
position:relative;
top:0;
z-index:1000;
border-bottom:1px solid var(--color-line2);
}

.site-header__inner{
margin:0 auto;
padding:0 2rem;
display:flex;
align-items:center;
justify-content:space-between;
border:0px #FF0000 solid;
height:5.5rem;
}


/* -------------------------------
ロゴ
---------------------------------- */
.site-logo{
width:55%;
max-width:230px;
}
.site-logo a{
display:block;
}

/* -------------------------------
グローバルメニュー
---------------------------------- */
.global-nav__list{
display:flex;
align-items:center;
gap:.5rem;
margin:0;
padding:0;
list-style:none;
border:0px #FF0000 solid;
}

.global-nav__item{
position:relative;
}

/* 親メニュー用　リンク */
.global-nav__item > a,
.global-nav__item > button{
display:block;
cursor:pointer;
padding:2.5rem 0 2.5rem 2.5rem;
letter-spacing:.06rem;
font-family:"mincho", serif;
text-decoration:none;
white-space:nowrap;
background:transparent;
border:0;
}

.global-nav__item > a:hover,
.global-nav__item > button:hover{
color:var(--color-hover1);
}

.has-sub > a::after,
.has-sub > button::after{
content:"";
display:inline-block;
width:.8rem;
height:.8rem;
margin-left:.5rem;
border-right:1px solid var(--color-line3);
border-bottom:1px solid var(--color-line3);
transform:rotate(45deg) translateY(-.5rem);
}


/* -------------------------------
サブメニュー
---------------------------------- */
.sub-menu{
position:absolute;
top:100%;
left:50%;
transform:translateX(-50%) translateY(10px);
min-width:210px;
margin:0;
padding:2rem 0;
list-style:none;
background:rgba(255,255,255,.9);
border:0px solid var(--color-line2);
box-shadow:0 18px 40px rgba(60,45,30,.23);
border-radius:.5rem;
backdrop-filter:blur(30px);
-webkit-backdrop-filter:blur(30px);
opacity:0;
visibility:hidden;
transition:.25s ease;
}

.has-sub:hover .sub-menu{
opacity:1;
visibility:visible;
transform:translateX(-50%) translateY(0);
}

.sub-menu a{
display:block;
padding:1.2rem 2rem;
font-family:"mincho", serif;
line-height:1.6;
text-decoration:none;
white-space:nowrap;
position:relative;
padding-left:2rem;
letter-spacing:.05em;
}

.sub-menu a::before{
content:"";
position:absolute;
left:0;
top:50%;
width:1rem;
height:1px;
background:var(--color-line3);
transform:translateY(-50%);
transition:.3s;
}

.sub-menu a:hover{
background:var(--color-gray2);
color:#FFF;
}

.nav-toggle{
display:none;
}

.hamburger{
display:none;
}


/* ///////////////////////// */
@media(max-width:1000px){

.hamburger{
display:flex;
flex-direction:column;
justify-content:center;
gap:6px;
width:3rem;
aspect-ratio:1/1;
cursor:pointer;
border:0px #FF0000 solid;
}

.hamburger span{
display:block;
width:2.5rem;
height:1px;
background:#3c2d24;
transition:.3s ease;
}

.global-nav{
position:relative;
position:fixed;
top:11.7rem;
left:0;
width:100%;
height:100vh;
overflow-y:auto;
background:#FFF;
transform:translateX(100%);
transition:.35s ease;
}

.global-nav::-webkit-scrollbar{
display:none;
}

.nav-toggle:checked ~ .global-nav{
transform:translateX(0);
}

.nav-toggle:checked + .hamburger span:nth-child(1){
transform:translateY(7px) rotate(45deg);
}

.nav-toggle:checked + .hamburger span:nth-child(2){
opacity:0;
}

.nav-toggle:checked + .hamburger span:nth-child(3){
transform:translateY(-7px) rotate(-45deg);
}

.global-nav__list{
display:block;
padding:2rem;
}

.global-nav__item > a,
.global-nav__item > button{
border:0px #00FF00 solid;
padding:2rem 1rem;
font-size:1.8rem;
border-bottom:1px var(--color-line2) solid;
}

.sub-menu{
position:static;
transform:none;
opacity:1;
visibility:visible;
box-shadow:none;
border:0px #FF0000 solid;
border-radius:0;
padding:0;
background:var(--bg2);
}

.sub-menu a{
padding:1.6rem 2rem;
border:0px #FF0000 solid;
border-bottom:1px var(--color-line1) solid;
font-size:1.6rem;
}

.has-sub:hover .sub-menu{
transform:none;
}
}


/* --------------------------------
Cart 数量バッジ
-------------------------------- */
.cart-icon{
position:relative;
display:inline-flex;
align-items:center;
justify-content:center;
}

.cart-count{
position:absolute;
top:-.7rem;
right:-1rem;

display:flex;
align-items:center;
justify-content:center;

min-width:1.8rem;
height:1.8rem;
padding:0 .4rem;

border-radius:999px;
background:#c45b5b;
color:#fff;

font-size:1rem;
font-weight:600;
line-height:1;
white-space:nowrap;
}