@charset "utf-8";
/* =========================================================
   2026 お歳暮ギフト特設（/ec/campaign/2026winter/gift/）
   すべて .gf 配下に閉じて、サイト共通CSSと干渉しないようにしています
   ブレイクポイント：767px以下をSP
   ========================================================= */
.gf{
  --red:#e51513; --ink:#333; --gray:#8c8c8c; --gold:#b89440;
  --cream:#fbf8ea; --mist:#f5f5f5; --line:#dedede; --ph:#b7b7b7;
  --sans:"Noto Sans JP","Noto Sans CJK JP","Hiragino Kaku Gothic ProN",sans-serif;
  --serif:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --w:1240px; --pad:100px;
  color:var(--ink); font-family:var(--sans); font-weight:500; letter-spacing:.05em; line-height:1.6;
  -webkit-text-size-adjust:100%; overflow-x:hidden;
}
.gf *,.gf *::before,.gf *::after{box-sizing:border-box}
/* サイト共通の ec_base.css が p・div・li などに直接指定している書体・文字サイズ・行間・文字色（#000）を打ち消し、.gf 内では親から継承させる */
.gf :where(p,div,td,li,dt,dd,section,figure,figcaption,ol,ul){font-family:inherit; font-size:inherit; line-height:inherit; color:inherit}
:where(.gf) img{max-width:100%; height:auto; vertical-align:bottom}
:where(.gf) :where(ul,ol){list-style:none; margin:0; padding:0}
:where(.gf) :where(p,h1,h2,h3,h4,dl,dd){margin:0}
:where(.gf) a{color:inherit; text-decoration:none}
:where(.gf) button{font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer}
.gf :focus-visible{outline:3px solid #1a73e8; outline-offset:2px}
.gf .pc{display:inline}
.gf-inner{max-width:calc(var(--w) + 40px); margin:0 auto; padding:0 20px}
.gf-sec{padding-bottom:80px; scroll-margin-top:120px}
.gf-sec--cream{background:var(--cream)}
.gf-sec--mist{background:var(--mist)}
#gf-home{background:var(--mist)}

/* ---------- 見出し ---------- */
.gf-head{display:flex; align-items:center; gap:60px; max-width:calc(var(--w) + 40px); margin:0 auto; padding:80px 20px 50px}
.gf-head__ttl{display:flex; align-items:center; gap:25px; font-family:var(--serif); font-weight:600; font-size:34px; letter-spacing:.15em; line-height:1.4; white-space:nowrap}
.gf-head__ttl::before{content:""; flex:none; width:17px; height:30px; border-radius:50%; background:var(--red)}
.gf-head__sub{font-size:18px}
.gf-sub-ttl{color:var(--red); font-size:20px; font-weight:500}

/* ---------- ボタン ---------- */
.gf-btns{display:grid; gap:15px}
.gf-btns--row{grid-template-columns:repeat(2,minmax(0,300px)); gap:20px}
.gf-btn{position:relative; display:flex; align-items:center; justify-content:center; min-height:48px; padding:0 40px; border-radius:30px; background:var(--red); color:#fff !important; font-size:16px; font-weight:700; letter-spacing:.05em; transition:opacity .2s}
.gf-btn::after{content:""; position:absolute; right:22px; top:50%; width:7px; height:7px; border-top:2px solid #fff; border-right:2px solid #fff; transform:translateY(-50%) rotate(45deg)}
.gf-btn--detail{background:var(--ink)}
.gf-btn--wide{width:320px; max-width:100%}
.gf-btn:hover{opacity:.8}

/* ---------- 価格 ---------- */
.gf-card__price{display:flex; flex-wrap:wrap; align-items:center; column-gap:10px; row-gap:2px}
.gf-price__normal{flex-basis:100%; color:var(--gray); font-size:16px; letter-spacing:0}
.gf-price{display:flex; align-items:center; gap:8px}
.gf-price__badge{width:47px; height:47px}
.gf-price__num{color:var(--red); font-size:37px; font-weight:700; letter-spacing:0; line-height:1.2; white-space:nowrap}
.gf-price__yen{font-size:20px}
.gf-price__tax{font-size:12px}
.gf-price--l .gf-price__badge{width:58px; height:58px}
.gf-price--l .gf-price__num{font-size:46px}
.gf-price--l .gf-price__yen{font-size:24px}
.gf-price--l .gf-price__tax{font-size:16px}
.gf-free span{display:block; width:41px; padding:2px 0; border:1px solid var(--red); border-radius:3px; color:var(--red); font-family:var(--serif); font-size:15px; line-height:1.15; letter-spacing:.1em; text-align:center}
.gf-free.is-empty,.gf-price__normal.is-empty{visibility:hidden}
.gf-free.is-empty{display:none}

/* ---------- 商品カード ---------- */
.gf-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:50px 39px}
.gf-card{display:flex; flex-direction:column; gap:12px}
.gf-card__img,.gf-rank__img{aspect-ratio:1; overflow:hidden; background:#fff}
.gf-card__img img,.gf-rank__img img{width:100%; height:100%; object-fit:cover}
.gf-card__name{min-height:3em; font-size:20px; font-weight:700; line-height:1.5}
.gf-card .gf-btns{margin-top:auto; padding-top:8px}
.gf-more{display:none}

/* ---------- タブ ---------- */
.gf-tabs{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:50px}
.gf-tab{width:100%; min-height:50px; border:2px solid var(--red); border-radius:5px; background:#fff; font-size:18px; letter-spacing:.06em}
.gf-tab.is-active{background:var(--red); color:#fff}
.gf-panel[hidden]{display:none}
.gf-panel{display:grid; grid-template-columns:minmax(0,1fr); gap:40px}
.gf-lead p{font-size:18px}

/* ---------- 01 FV ---------- */
.gf-fv{position:relative; height:min(65.8vw,948px); min-height:640px; overflow:hidden}
.gf-fv__visual,.gf-fv__photo{position:absolute; inset:0; width:100%; height:100%}
.gf-fv__photo{object-fit:cover; object-position:77% 97%}
.gf-fv__title{position:absolute; left:75%; top:16.8%; width:clamp(100px,9.65vw,139px)}
.gf-digest{position:absolute; left:0; right:0; bottom:0; max-width:calc(var(--w) + 40px); margin:0 auto; padding:0 20px}
.gf-digest__head{display:flex; flex-direction:column; align-items:flex-start; gap:12px; margin-bottom:24px}
.gf-digest__head span{padding:4px 16px; border-radius:5px; background:#fff; font-family:var(--serif); font-weight:600; font-size:22px; letter-spacing:.1em}
.gf-digest__list{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:50px}
.gf-digest__item{padding:20px 20px 28px; border-top:2px solid var(--red); border-radius:5px 5px 0 0; background:#fff; text-align:center}
.gf-digest__meta{color:var(--gold); font-size:14px}
.gf-digest__q{position:relative; margin-top:10px; padding:0 34px; font-family:var(--serif); font-weight:500; font-size:17px; line-height:1.8}
.gf-digest__q::before,.gf-digest__q::after{position:absolute; top:50%; font-size:40px; line-height:1; transform:translateY(-50%)}
.gf-digest__q::before{content:"“"; left:0}
.gf-digest__q::after{content:"”"; right:0}
.gf-digest__foot{display:none}

/* ---------- 02 特典 ---------- */
.gf-benefit{padding:60px 0 80px}
.gf-banner{display:flex; align-items:center; justify-content:center; aspect-ratio:4/1; border-radius:5px; background:var(--ph); color:#fff; font-weight:700}
.gf-nabe,.gf-nabe img{display:block; width:100%}
.gf-benefit__list picture,.gf-benefit__list img{display:block; width:100%}
.gf-benefit__list{display:flex; justify-content:center; gap:70px; margin-top:50px}
.gf-benefit__list li{width:480px}

/* ---------- 03 固定ナビ ---------- */
/* スクロールでナビの位置を過ぎたら、共通ヘッダー（スクロール時に上部固定）のすぐ下に固定
   （.is-fixed は gift.js で付け外し）。位置と重なり順は 2026summer/gift の .c-25summer-anchor に合わせています
   PC：top 60px／770px以下：top 50px、z-index 4（共通ヘッダー40・ハンバーガーメニュー5より下） */
.gf-nav-wrap{--gf-nav-top:60px; position:relative; z-index:4}
.gf-nav{position:relative; background:#fff; border-bottom:1px solid #dbdbdb}
.gf-nav.is-fixed{position:fixed; top:var(--gf-nav-top); left:0; right:0; box-shadow:0 2px 6px rgba(0,0,0,.08)}
.gf-nav__list{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); max-width:calc(var(--w) + 40px); margin:0 auto; padding:0 20px}
.gf-nav__link{display:block; padding:16px 0 13px; border-bottom:3px solid transparent; font-size:16px; font-weight:700; text-align:center}
.gf-nav__link.is-current{border-bottom-color:var(--red); color:var(--red)}

/* ---------- 04 おすすめ ---------- */
.gf-pick{margin-bottom:80px}
.gf-pick:last-child{margin-bottom:0}
.gf-pick__banner{position:relative; display:flex; align-items:center; min-height:440px; background:center/cover no-repeat}
.gf-pick__banner--futo{background-image:url(img/futo_bg_pc.webp); color:#fff}
.gf-pick__banner--taru{background-image:url(img/taru_bg_pc.webp)}
.gf-pick__bannerin{width:100%; max-width:calc(var(--w) + 40px); margin:0 auto; padding:40px 20px}
.gf-pick__catch{font-family:var(--serif); font-weight:600; font-size:22px; letter-spacing:.1em}
.gf-pick__ttl{margin:10px 0 24px; font-family:var(--serif); font-weight:700; font-size:56px; letter-spacing:.15em; line-height:1.3}
.gf-pick__ttl--s{font-size:42px}
.gf-pick__lead{font-size:16px; line-height:2}
.gf-pick__no1{position:absolute; right:max(20px,calc(50% - 620px)); top:40px; width:139px}
.gf-item{display:grid; grid-template-columns:500px 1fr; gap:60px; margin-top:50px}
.gf-item__body{display:flex; flex-direction:column; gap:20px}
.gf-catch{color:var(--red); font-size:20px}
.gf-item__name,.gf-set__name{font-family:var(--serif); font-weight:700; font-size:27px; letter-spacing:.08em; line-height:1.5}
.gf-chips{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:50px}
.gf-chip{width:100%; min-height:50px; border:2px solid var(--red); border-radius:5px; background:#fff; font-size:18px}
.gf-chip.is-active{background:var(--red); color:#fff}
.gf-reason{padding:20px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink)}
.gf-reason__ttl,.gf-contents__ttl{margin-bottom:14px; font-size:18px; font-weight:700}
.gf-reason ol{display:grid; gap:14px}
.gf-reason li{display:flex; gap:18px}
.gf-reason b{font-size:16px}
.gf-reason li p{font-size:14px; font-weight:400; line-height:1.7}
.gf-num{flex:none; width:1.1em; color:var(--red); font-size:20px; line-height:1.3}
.gf-acc{background:var(--mist)}
.gf-acc summary{position:relative; display:block; padding:16px 50px 16px 20px; font-size:15px; cursor:pointer; list-style:none}
.gf-acc summary::-webkit-details-marker{display:none}
.gf-acc summary::after{content:""; position:absolute; right:22px; top:50%; width:8px; height:8px; border-right:2px solid var(--ink); border-bottom:2px solid var(--ink); transform:translateY(-70%) rotate(45deg); transition:transform .2s}
.gf-acc[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.gf-spec{display:grid; grid-template-columns:8em 1fr; gap:8px 16px; padding:0 20px 20px; font-size:14px}
.gf-spec dt{color:var(--gray)}

/* ギャラリー */
.gf-gallery__main{aspect-ratio:1; overflow:hidden; background:#e5e5e5}
.gf-gallery__main img{width:100%; height:100%; object-fit:cover}
.gf-gallery__thumbs{display:flex}
.gf-gallery__thumbs li{width:25%}
.gf-thumb{display:block; width:100%; aspect-ratio:1; overflow:hidden; border:3px solid transparent; background:#e5e5e5}
.gf-thumb img{width:100%; height:100%; object-fit:cover}
.gf-thumb.is-active{border-color:var(--red)}

/* ---------- 05 声 ---------- */
.gf-voices{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:50px}
.gf-voice{display:flex; flex-direction:column; gap:16px; padding:30px 36px; border-top:2px solid var(--red); border-radius:5px; background:#fff}
.gf-voices:not(.is-open) .gf-voice.is-extra{display:none}
.gf-voice__meta{color:var(--gold); font-size:16px}
.gf-voice__ttl{font-family:var(--serif); font-weight:600; font-size:19px; line-height:1.6}
.gf-voice__txt{font-size:15px; font-weight:400; line-height:1.8; letter-spacing:.03em}
.gf-more--voice{display:flex; align-items:center; justify-content:center; gap:12px; width:300px; min-height:48px; margin:40px auto 0; border:1px solid var(--ink); border-radius:30px; background:#fff; font-weight:700}
.gf-more--voice::after,.gf-more::after{content:""; width:7px; height:7px; border-right:2px solid var(--ink); border-bottom:2px solid var(--ink); transform:translateY(-2px) rotate(45deg)}
.gf-more--voice[aria-expanded="true"]::after{transform:translateY(2px) rotate(-135deg)}

/* ---------- 06 ランキング ---------- */
.gf-rank{padding:40px 50px 50px; background:var(--mist)}
.gf-rank__ttl{margin-bottom:30px; color:var(--red); font-size:20px; font-weight:500; text-align:center}
.gf-rank__list{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px}
.gf-rank__item{display:flex; flex-direction:column; gap:12px}
.gf-rank__crown{position:relative; width:69px; margin:0 auto}
.gf-rank__crown span{position:absolute; left:0; right:0; top:14px; color:#fff; font-size:16px; text-align:center}
.gf-rank__item .gf-btns{margin-top:auto; padding-top:8px}
.gf-dots{display:none}

/* ---------- 07 AnyGift ---------- */
.gf-anygift{display:flex; align-items:center; gap:40px; padding:30px 40px; border-radius:5px; background:#fff}
.gf-anygift__img{flex:none; width:280px}
.gf-anygift__body{display:flex; flex-direction:column; gap:14px}
.gf-anygift__lead{color:var(--red); font-size:18px}
.gf-anygift__ttl{font-family:var(--serif); font-weight:600; font-size:26px; letter-spacing:.08em}
.gf-anygift__txt{font-size:16px; font-weight:400; line-height:1.8}

/* ---------- 08 ギフトセット ---------- */
.gf-revival{display:flex; align-items:center; gap:36px; margin-bottom:40px; padding:24px 40px; border:1px solid var(--red); border-radius:5px; background:#fff}
.gf-revival img{width:220px; aspect-ratio:220/140; object-fit:cover}
.gf-revival__ttl{margin-bottom:8px; color:var(--red); font-size:20px}
.gf-revival p:not(.gf-revival__ttl){font-weight:400}
.gf-set{display:grid; grid-template-columns:460px 1fr; gap:50px; margin-bottom:40px; padding:50px; border-radius:5px; background:#fff}
.gf-set:last-child{margin-bottom:0}
.gf-set .gf-gallery__thumbs li{width:20%}
.gf-set__body{display:flex; flex-direction:column; gap:22px}
.gf-tag{align-self:flex-start; padding:4px 12px; border:1px solid var(--red); border-radius:20px; color:var(--red); font-size:14px}
.gf-set__body .gf-catch{font-size:18px}
.gf-contents{padding:20px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink)}
.gf-contents ol{display:grid; gap:12px}
.gf-contents li{display:flex; gap:18px; font-size:16px}
.gf-boxsize{padding:14px 20px; background:var(--mist)}

/* ---------- 09 のし ---------- */
.gf-wrap{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:50px}
.gf-wrap li{display:flex; flex-direction:column; gap:16px}
.gf-wrap__img{aspect-ratio:380/240; overflow:hidden}
.gf-wrap__img img{width:100%; height:100%; object-fit:cover}
.gf-wrap__ttl{font-family:var(--serif); font-weight:600; font-size:22px; letter-spacing:.08em}
.gf-wrap li p:not(.gf-wrap__ttl){font-weight:400; line-height:1.8}
.gf-delivery{margin-top:40px; padding:30px 40px; border-radius:5px; background:var(--mist)}
.gf-delivery__ttl{margin-bottom:12px; font-size:18px; font-weight:700}
.gf-delivery li{font-weight:400; line-height:1.9}
.gf-delivery li::before{content:"・"}

/* ---------- 10 ご自宅用 ---------- */
.gf-home{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; margin-top:40px}
.gf-home__main{display:flex; flex-direction:column; border-radius:5px; overflow:hidden; background:#fff}
.gf-home__img{position:relative; display:block; aspect-ratio:610/320; overflow:hidden}
.gf-home__img img{width:100%; height:100%; object-fit:cover}
.gf-home__tag{position:absolute; left:0; top:24px; padding:6px 16px; background:var(--red); color:#fff; font-weight:700; letter-spacing:.1em}
.gf-home__body{display:flex; flex-direction:column; align-items:center; gap:10px; padding:30px 40px; text-align:center}
.gf-home__lead{color:var(--red)}
.gf-home__ttl{font-family:var(--serif); font-weight:700; font-size:30px; letter-spacing:.1em}
.gf-home__txt{margin-bottom:10px; font-weight:400; line-height:1.8}
.gf-home__subs{display:grid; gap:24px}
.gf-home__sub{display:flex; flex-direction:column; gap:8px}
.gf-home__subimg{display:block; aspect-ratio:587/220; overflow:hidden; border-radius:5px}
.gf-home__subimg img{width:100%; height:100%; object-fit:cover}
.gf-home__subttl{font-size:20px; font-weight:700}
.gf-home__subttl::after{content:"　›"}
.gf-home__subtxt{color:var(--gray); font-size:14px}
.gf-home__main:hover .gf-btn,.gf-home__sub:hover{opacity:.8}

/* =========================================================
   SP
   ========================================================= */
@media (max-width:767px){
  .gf .pc{display:none}
  .gf-sec{padding-bottom:48px; scroll-margin-top:100px}
  .gf-head{display:block; padding:48px 20px 24px}
  .gf-head__ttl{gap:14px; font-size:24px; letter-spacing:.1em}
  .gf-head__ttl::before{width:12px; height:22px}
  .gf-head__sub{margin-top:10px; font-size:14px}
  .gf-sub-ttl{font-size:17px}
  .gf-btn{min-height:44px; padding:0 30px; font-size:15px}
  .gf-btns--row{grid-template-columns:1fr; gap:12px}
  .gf-btn--wide{width:100%}

  .gf-grid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 11px}
  .gf-card{gap:8px}
  .gf-card__name{min-height:3em; font-size:14px}
  .gf-card .gf-btn,.gf-rank__item .gf-btn{min-height:36px; padding:0 22px 0 10px; font-size:12px; letter-spacing:.02em}
  .gf-card .gf-btn::after,.gf-rank__item .gf-btn::after{right:14px; width:6px; height:6px}
  .gf-card .gf-btns,.gf-rank__item .gf-btns{gap:8px}
  .gf-price__normal{font-size:11px}
  .gf-price{gap:6px}
  .gf-price__badge{width:30px; height:30px}
  .gf-price__num{font-size:22px}
  .gf-price__yen{font-size:12px}
  .gf-price__tax{font-size:9px}
  .gf-price--l .gf-price__badge{width:44px; height:44px}
  .gf-price--l .gf-price__num{font-size:30px}
  .gf-price--l .gf-price__yen{font-size:16px}
  .gf-price--l .gf-price__tax{font-size:10px}
  /* 送料無料は金額の下に1行で */
  .gf-card__price .gf-free{flex-basis:100%}
  .gf-free span{display:inline-block; width:auto; padding:1px 6px; font-size:11px; line-height:1.4; letter-spacing:.05em}
  .gf-free.is-empty{display:block; visibility:hidden}
  .gf-grid--more:not(.is-open) > li:nth-child(n+5){display:none}
  .gf-more{display:flex; align-items:center; justify-content:center; gap:10px; width:100%; min-height:44px; border:1px solid var(--ink); border-radius:30px; background:#fff; font-size:14px; font-weight:700}
  .gf-more[hidden]{display:none}
  .gf-more[aria-expanded="true"]::after{transform:translateY(2px) rotate(-135deg)}

  .gf-tabs{gap:6px; margin-bottom:24px}
  .gf-tabs--budget{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 11px}
  .gf-tab{min-height:44px; font-size:14px}
  .gf-panel{gap:24px}
  .gf-lead p{font-size:14px}

  /* スライダー共通（横スクロール＋スナップ） */
  .js-slider{display:flex !important; gap:12px; margin:0 -20px; padding:0 20px 4px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:0 20px; scrollbar-width:none}
  .js-slider::-webkit-scrollbar{display:none}
  .js-slider > li{flex:none; scroll-snap-align:start}
  .gf-dots{display:flex; justify-content:center; gap:6px; margin-top:14px}
  .gf-dots i{width:7px; height:7px; border-radius:50%; background:var(--line)}
  .gf-dots i.is-active{background:var(--red)}

  /* 01 FV */
  .gf-fv{height:auto; min-height:0}
  .gf-fv__visual{position:relative; height:520px}
  .gf-fv__photo{object-position:52% 50%}
  .gf-fv__title{left:auto; right:12px; top:36px; width:84px}
  .gf-digest{position:static; padding:32px 20px 28px; background:var(--cream)}
  .gf-digest__head{gap:8px; margin-bottom:18px}
  .gf-digest__head span{padding:4px 12px; font-size:18px; letter-spacing:.05em}
  .gf-digest__item{width:290px; padding:18px 20px; border-radius:5px}
  .gf-digest__meta{font-size:13px}
  .gf-digest__q{padding:0 22px; font-size:15px; line-height:1.7}
  .gf-digest__q::before,.gf-digest__q::after{font-size:30px}
  .gf-digest__foot{display:flex; align-items:center; justify-content:space-between; margin-top:12px}
  .gf-digest__foot .gf-dots{margin-top:0}
  .gf-digest__more{color:var(--red); font-size:13px; font-weight:700}
  .gf-digest__more::after{content:" ↓"}

  /* 02 */
  .gf-benefit{padding:28px 0}
  .gf-benefit__list{flex-direction:column; align-items:center; gap:14px; margin-top:14px}
  .gf-benefit__list li{width:100%}

  /* 03 */
  .gf-nav__list{padding:0}
  .gf-nav__link{padding:14px 0 11px; font-size:14px}

  /* 04 */
  .gf-pick{margin-bottom:48px}
  .gf-pick__banner{display:block; min-height:0; background:none; color:var(--ink) !important}
  .gf-pick__banner::before{content:""; display:block; aspect-ratio:375/210; background:center/cover no-repeat}
  .gf-pick__banner--futo::before{background-image:url(img/futo_bg_sp.webp)}
  .gf-pick__banner--taru::before{background-image:url(img/taru_bg_sp.webp)}
  .gf-pick__bannerin{padding:22px 20px 4px}
  .gf-pick__catch{font-size:15px}
  .gf-pick__ttl{margin:8px 0 10px; font-size:30px; letter-spacing:.08em}
  .gf-pick__ttl--s{font-size:22px}
  .gf-pick__lead{font-size:14px; font-weight:400; line-height:1.8}
  .gf-pick__no1{right:14px; top:14px; width:76px}
  .gf-chips{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 11px; margin-top:22px}
  .gf-chip{min-height:40px; font-size:13px}
  .gf-item{grid-template-columns:1fr; gap:18px; margin-top:22px}
  .gf-item__body{gap:16px}
  .gf-catch{font-size:14px}
  .gf-item__name,.gf-set__name{font-size:20px}
  .gf-reason__ttl,.gf-contents__ttl{font-size:16px}
  .gf-reason b{font-size:15px}
  .gf-reason li p{font-size:13px}
  .gf-num{font-size:18px}
  .gf-acc summary{padding:14px 44px 14px 16px; font-size:12px}
  .gf-spec{grid-template-columns:7em 1fr; padding:0 16px 16px; font-size:13px}

  /* 05 */
  .gf-voice{width:300px; padding:22px; gap:12px}
  .gf-voices .gf-voice.is-extra{display:flex !important}
  .gf-voice__meta{font-size:13px}
  .gf-voice__ttl{font-size:16px}
  .gf-voice__txt{font-size:13px}
  .gf-more--voice{display:none}

  /* 06 */
  .gf-rank{margin:0 -20px; padding:22px 0}
  .gf-rank__ttl{margin-bottom:16px; padding:0 16px; font-size:17px; text-align:left}
  .gf-rank__list{margin:0; padding:0 16px 4px; scroll-padding:0 16px}
  .gf-rank__item{width:250px; padding:16px 16px 18px; border-radius:5px; background:#fff}
  .gf-rank__item .gf-card__name{font-size:14px}

  /* 07 */
  .gf-anygift{flex-direction:column; align-items:stretch; gap:12px; padding:22px 20px}
  .gf-anygift__img{width:100%}
  .gf-anygift__lead{font-size:14px}
  .gf-anygift__ttl{font-size:19px}
  .gf-anygift__txt{font-size:13px}

  /* 08 */
  .gf-revival{gap:14px; margin-bottom:20px; padding:14px}
  .gf-revival img{width:110px}
  .gf-revival__ttl{font-size:14px; line-height:1.5}
  .gf-revival p:not(.gf-revival__ttl){font-size:12px}
  .gf-set{grid-template-columns:1fr; gap:16px; margin-bottom:20px; padding:20px}
  .gf-set__body{gap:14px}
  .gf-tag{font-size:12px}
  .gf-set__body .gf-catch{font-size:14px}
  .gf-contents li{gap:12px; font-size:13px}
  .gf-boxsize{padding:12px 14px; font-size:12px}

  /* 09 */
  .gf-wrap > li{width:260px; gap:12px}
  .gf-wrap__ttl{font-size:16px}
  .gf-wrap li p:not(.gf-wrap__ttl){font-size:12px}
  .gf-delivery{margin-top:24px; padding:18px}
  .gf-delivery__ttl{font-size:15px}
  .gf-delivery li{font-size:13px}

  /* 10 */
  .gf-home{grid-template-columns:1fr; gap:24px; margin-top:24px}
  .gf-home__body{padding:18px; gap:8px}
  .gf-home__tag{top:10px; padding:3px 10px; font-size:12px}
  .gf-home__ttl{font-size:22px}
  .gf-home__txt{font-size:13px}
  .gf-home__subttl{font-size:15px}
  .gf-home__subtxt{font-size:12px}
}
@media (max-width:770px){
  .gf-nav-wrap{--gf-nav-top:50px}
}
@media (prefers-reduced-motion:reduce){
  .gf *{transition:none !important; scroll-behavior:auto !important}
}

/* カートポップアップ（ec/popup.tpl）の基本スタイル：2026summer/under.css より */
.c-popup {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
	opacity: 0;
	visibility: hidden;
	transition: 0.6s;
}

.c-popup.is-show {
	opacity: 1;
	visibility: visible;
}

.c-popup__inner {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 90%;
	max-width: 1200px;
	padding: 30px 0 0;
	background-color: #fff;
	z-index: 2;
	border-radius: 10px;
}

.c-popup__inner img {
	width: 100%;
}


.c-popup__close {
    position: relative;
	left: 47%;
    top: -25px;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
}
@media screen and (max-width: 770px) {
	.c-popup__close {
		left: 43%;
		top: -28px;
		}
	}

.c-popup__close:before{
	content: "閉じる";
    font-size: 17px;
	font-weight: 500;
    position: absolute;
    right: 52%;
}
@media screen and (max-width: 770px) {
	.c-popup__close:before {
		right: 54%;
        top: 2px;
        font-size: 13px;
		}
	}

.c-popup__close span {
    display: block;
    width: 25px;
    height: 3px;
    background: #111111;
    margin: 0 0 5px;
    transition: 0.3s;
    position: absolute;
    top: 50%;
    left: 50%;
}
@media screen and (max-width: 770px) {
	.c-popup__close span {
		width: 18px;
		}
	}

.c-popup__close span:nth-child(1) {
	transform: translate(-50%, -50%) rotate(45deg);
}

.c-popup__close span:nth-child(2) {
	transform: translate(-50%, -50%) rotate(-45deg);
}

.c-popup__content {
	max-height: 80vh;
	padding: 0 50px 50px;
	display: flex;
	gap: 50px;
}

@media screen and (max-width: 770px) {
	.c-popup__content {
		display: block;
		overflow-y: scroll;
		padding: 0 20px 50px;
	}
}

.c-popup__inner img {
	width: 100%;
	margin-top: 30px;
}

@media screen and (max-width: 770px) {
	.c-popup__inner img {
		margin-top: 20px;
	}
}

@media screen and (max-width: 770px) {
	.c-popup__content {
		display: block;
		overflow-y: scroll;
	}
}




.c-popup__background {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.8);
	z-index: 1;
	cursor: pointer;
}