{"id":11231,"date":"2026-10-06T12:34:30","date_gmt":"2026-10-06T03:34:30","guid":{"rendered":"https:\/\/www.grandmama-and-kato.com\/blog\/?p=11231"},"modified":"2026-10-10T10:29:30","modified_gmt":"2026-10-10T01:29:30","slug":"from-the-pages-fudge-magazine","status":"publish","type":"post","link":"https:\/\/www.grandmama-and-kato.com\/blog\/2026\/10\/06\/from-the-pages-fudge-magazine\/","title":{"rendered":"FROM THE PAGES FUDGE MAGAZINE"},"content":{"rendered":"<style>\r\n\r\n\/* =========================================\r\n   BASE\r\n========================================= *\/\r\n\r\n.magazine-feature {\r\n  --navy: #26364D;\r\n  --charcoal: #343A40;\r\n  --cool-gray: #8A929C;\r\n  --light-gray: #E5E7EB;\r\n  --bg-gray: #F4F5F6;\r\n\r\n  width: 100% !important;\r\n  margin: 0 auto !important;\r\n  padding: 0 20px 120px !important;\r\n\r\n  box-sizing: border-box;\r\n\r\n  background: var(--bg-gray);\r\n  color: var(--charcoal);\r\n\r\n  text-align: center !important;\r\n}\r\n\r\n.magazine-feature *,\r\n.magazine-feature *::before,\r\n.magazine-feature *::after {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.magazine-feature h1,\r\n.magazine-feature h2,\r\n.magazine-feature h3,\r\n.magazine-feature h4,\r\n.magazine-feature p,\r\n.magazine-feature a,\r\n.magazine-feature button {\r\n  text-align: center !important;\r\n}\r\n\r\n.magazine-inner {\r\n  width: 100% !important;\r\n  max-width: 1000px !important;\r\n\r\n  margin: 0 auto !important;\r\n  padding: 0 !important;\r\n\r\n  text-align: center !important;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   HERO\r\n   Magazine \/ Editorial Style\r\n========================================= *\/\r\n\r\n.magazine-hero {\r\n  width: 100%;\r\n  padding: 130px 20px 145px;\r\n\r\n  text-align: center !important;\r\n\r\n  background: #f8f8f6;\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   Eyebrow\r\n----------------------------------------- *\/\r\n\r\n.magazine-eyebrow {\r\n  margin: 0 0 22px !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: 10px;\r\n  font-weight: 400;\r\n  letter-spacing: .22em;\r\n  line-height: 1.6;\r\n\r\n  color: #777d82;\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   Main Title\r\n----------------------------------------- *\/\r\n\r\n.magazine-title {\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n\r\n  font-family: \"Cormorant Garamond\", \"Times New Roman\", serif;\r\n  font-size: clamp(38px, 5.5vw, 64px);\r\n  font-weight: 400;\r\n  letter-spacing: .04em;\r\n  line-height: 1;\r\n\r\n  color: #182633;\r\n}\r\n\r\n\r\n\r\n\/* -----------------------------------------\r\n   Date \/ Season\r\n----------------------------------------- *\/\r\n\r\n.magazine-date {\r\n  margin: 25px 0 0 !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: 9px;\r\n  font-weight: 400;\r\n  letter-spacing: .24em;\r\n  line-height: 1.6;\r\n\r\n  color: #777d82;\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   Decorative Line\r\n----------------------------------------- *\/\r\n\r\n.magazine-hero::after {\r\n  content: \"\";\r\n\r\n  display: block;\r\n\r\n  width: 1px;\r\n  height: 65px;\r\n\r\n  margin: 55px auto 0;\r\n\r\n  background: #182633;\r\n  opacity: .35;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   IMAGE\r\n   \u203b\u753b\u50cf\u3092\u4f7f\u308f\u306a\u3044\u5834\u5408\u306f\u975e\u8868\u793a\r\n========================================= *\/\r\n\r\n.magazine-hero-image {\r\n  display: none !important;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   IMAGE ANIMATION\r\n   \u203b\u753b\u50cf\u3092\u4f7f\u308f\u306a\u3044\u5834\u5408\u3067\u3082\u65e2\u5b58CSS\u3092\u6b8b\u3057\u3066OK\r\n========================================= *\/\r\n\r\n.magazine-image-fade {\r\n  opacity: 0;\r\n  transform: translateY(35px) scale(.96);\r\n\r\n  transition:\r\n    opacity 1.2s ease,\r\n    transform 1.6s cubic-bezier(.22,.61,.36,1);\r\n}\r\n\r\n.magazine-image-fade.is-visible {\r\n  opacity: 1;\r\n  transform: translateY(0) scale(1);\r\n}\r\n\r\n.magazine-image-fade img {\r\n  display: block !important;\r\n\r\n  width: 100% !important;\r\n  max-width: 100% !important;\r\n  height: auto !important;\r\n\r\n  margin: 0 auto !important;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   INTRO\r\n========================================= *\/\r\n\r\n.magazine-intro {\r\n  width: 100%;\r\n\r\n  padding: 0 20px 145px;\r\n\r\n  text-align: center !important;\r\n\r\n  background: #f8f8f6;\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   Intro Motion\r\n----------------------------------------- *\/\r\n\r\n.magazine-intro-motion {\r\n  opacity: 0;\r\n  transform: translateY(25px);\r\n\r\n  transition:\r\n    opacity .9s ease,\r\n    transform 1s cubic-bezier(.22,.61,.36,1);\r\n}\r\n\r\n.magazine-intro-motion.is-visible {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   Intro Title\r\n----------------------------------------- *\/\r\n\r\n.magazine-intro-title {\r\n  position: relative;\r\n\r\n  display: inline-block;\r\n\r\n  margin: 0 0 32px !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: 10px;\r\n  font-weight: 400;\r\n  letter-spacing: .24em;\r\n  line-height: 1.6;\r\n\r\n  color: #182633;\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   Small Line\r\n----------------------------------------- *\/\r\n\r\n.magazine-intro-title::after {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n\r\n  left: 50%;\r\n  bottom: -13px;\r\n\r\n  width: 24px;\r\n  height: 1px;\r\n\r\n  transform: translateX(-50%);\r\n\r\n  background: #182633;\r\n  opacity: .4;\r\n}\r\n\r\n\r\n\/* -----------------------------------------\r\n   Intro Text\r\n----------------------------------------- *\/\r\n\r\n.magazine-intro-text {\r\n  width: 100%;\r\n  max-width: 500px;\r\n\r\n  margin: 0 auto !important;\r\n\r\n  font-family: \"Noto Serif JP\", serif;\r\n  font-size: 13px;\r\n  font-weight: 400;\r\n  line-height: 2.4;\r\n\r\n  letter-spacing: .05em;\r\n\r\n  color: #333;\r\n\r\n}\r\n\r\n\r\n\/* =========================================\r\n   MOBILE\r\n========================================= *\/\r\n\r\n@media screen and (max-width: 767px) {\r\n\r\n  .magazine-hero {\r\n    padding: 95px 20px 110px;\r\n  }\r\n\r\n  .magazine-eyebrow {\r\n    margin-bottom: 18px !important;\r\n\r\n    font-size: 9px;\r\n    letter-spacing: .2em;\r\n  }\r\n\r\n  .magazine-title {\r\n    font-size: clamp(44px, 15vw, 68px);\r\n    letter-spacing: .03em;\r\n  }\r\n\r\n  .magazine-date {\r\n    margin-top: 20px !important;\r\n\r\n    font-size: 8px;\r\n    letter-spacing: .2em;\r\n  }\r\n\r\n  .magazine-hero::after {\r\n    height: 45px;\r\n    margin-top: 42px;\r\n  }\r\n\r\n  .magazine-intro {\r\n    padding: 0 20px 110px;\r\n  }\r\n\r\n  .magazine-intro-title {\r\n    font-size: 9px;\r\n  }\r\n\r\n  .magazine-intro-text {\r\n    font-size: 12px;\r\n    line-height: 2.3;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* =========================================\r\n   LOOK\r\n========================================= *\/\r\n\r\n.magazine-look {\r\n  width: 100%;\r\n\r\n  margin: 0 !important;\r\n  padding: 110px 0 120px;\r\n\r\n  border-top: 1px solid rgba(138,146,156,.3);\r\n\r\n  text-align: center !important;\r\n}\r\n\r\n.look-heading-motion {\r\n  opacity: 0;\r\n  transform: translateY(20px);\r\n\r\n  transition:\r\n    opacity .8s ease,\r\n    transform .9s cubic-bezier(.22,.61,.36,1);\r\n}\r\n\r\n.look-heading-motion.is-visible {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n.look-number {\r\n  margin: 0 0 14px !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: 10px;\r\n  font-weight: 400;\r\n  letter-spacing: .18em;\r\n  line-height: 1.5;\r\n\r\n  color: var(--cool-gray);\r\n}\r\n\r\n.look-title {\r\n  margin: 0 !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: 20px;\r\n  font-weight: 400;\r\n  letter-spacing: .12em;\r\n  line-height: 1.5;\r\n\r\n  color: var(--navy);\r\n}\r\n\r\n\r\n\/* =========================================\r\n   LOOK IMAGE\r\n========================================= *\/\r\n\r\n.look-image {\r\n  width: 100%;\r\n  max-width: 650px;\r\n\r\n  margin: 55px auto 0 !important;\r\n}\r\n\r\n.look-image img {\r\n  display: block !important;\r\n\r\n  width: 100% !important;\r\n  max-width: 100% !important;\r\n  height: auto !important;\r\n\r\n  margin: 0 auto !important;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   LOOK COMMENT\r\n========================================= *\/\r\n\r\n.look-comment {\r\n  width: 100%;\r\n  max-width: 600px;\r\n\r\n  margin: 45px auto 0 !important;\r\n\r\n  font-family: \"Noto Serif JP\", serif;\r\n  font-size: 14px;\r\n  line-height: 2.3;\r\n\r\n  color: var(--charcoal);\r\n}\r\n\r\n\r\n\/* =========================================\r\n   PICK UP\r\n========================================= *\/\r\n\r\n.magazine-pickup{\r\n  width:100% !important;\r\n  max-width:1000px !important;\r\n\r\n  margin:100px auto 0 !important;\r\n  padding:0 !important;\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n\/* HEADING *\/\r\n\r\n.pickup-heading{\r\n  width:100% !important;\r\n\r\n  margin:0 0 55px !important;\r\n  padding:0 !important;\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-number{\r\n  display:block !important;\r\n\r\n  width:100% !important;\r\n\r\n  margin:0 0 14px !important;\r\n  padding:0 !important;\r\n\r\n  font-family:Helvetica, Arial, sans-serif;\r\n  font-size:10px;\r\n  font-weight:400;\r\n\r\n  letter-spacing:.18em;\r\n  line-height:1.5;\r\n\r\n  color:var(--cool-gray);\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-title{\r\n  display:block !important;\r\n\r\n  width:100% !important;\r\n\r\n  margin:0 !important;\r\n  padding:0 !important;\r\n\r\n  font-family:Helvetica, Arial, sans-serif;\r\n  font-size:20px;\r\n  font-weight:400;\r\n\r\n  letter-spacing:.12em;\r\n  line-height:1.5;\r\n\r\n  color:var(--navy);\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n\/* SLIDER *\/\r\n\r\n.pickup-slider-wrap{\r\n  position:relative;\r\n\r\n  width:100% !important;\r\n  max-width:650px !important;\r\n\r\n  margin:0 auto !important;\r\n  padding:0 !important;\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-slider{\r\n  width:100% !important;\r\n\r\n  margin:0 auto !important;\r\n  padding:0 !important;\r\n\r\n  overflow:hidden !important;\r\n\r\n  position:relative;\r\n\r\n  text-align:center !important;\r\n\r\n  touch-action:pan-y;\r\n}\r\n\r\n\r\n.pickup-track{\r\n  display:flex !important;\r\n\r\n  flex-direction:row !important;\r\n  flex-wrap:nowrap !important;\r\n\r\n  width:100% !important;\r\n\r\n  margin:0 !important;\r\n  padding:0 !important;\r\n\r\n  transform:translate3d(0,0,0);\r\n\r\n  transition:\r\n    transform .65s cubic-bezier(.22,.61,.36,1);\r\n\r\n  will-change:transform;\r\n}\r\n\r\n\r\n.pickup-slide{\r\n  display:block !important;\r\n\r\n  flex:0 0 100% !important;\r\n\r\n  width:100% !important;\r\n  min-width:100% !important;\r\n\r\n  margin:0 !important;\r\n  padding:0 !important;\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-image{\r\n  display:block !important;\r\n\r\n  width:100% !important;\r\n  max-width:500px !important;\r\n\r\n  margin:0 auto !important;\r\n  padding:0 !important;\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-image img{\r\n  display:block !important;\r\n\r\n  width:100% !important;\r\n  max-width:100% !important;\r\n\r\n  height:auto !important;\r\n\r\n  margin:0 auto !important;\r\n  padding:0 !important;\r\n\r\n  pointer-events:none;\r\n\r\n  user-select:none;\r\n\r\n  -webkit-user-drag:none;\r\n}\r\n\r\n\r\n\/* ARROWS *\/\r\n\r\n.pickup-arrow{\r\n  position:absolute;\r\n\r\n  top:50%;\r\n  z-index:10;\r\n\r\n  display:flex !important;\r\n\r\n  align-items:center;\r\n  justify-content:center;\r\n\r\n  width:38px !important;\r\n  height:38px !important;\r\n\r\n  margin:0 !important;\r\n  padding:0 !important;\r\n\r\n  border:1px solid rgba(38,54,77,.35);\r\n  border-radius:50%;\r\n\r\n  background:rgba(255,255,255,.92);\r\n\r\n  color:var(--navy);\r\n\r\n  font-family:Arial,sans-serif;\r\n  font-size:14px;\r\n\r\n  line-height:1;\r\n\r\n  cursor:pointer;\r\n\r\n  transform:translateY(-50%);\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-prev{\r\n  left:-19px;\r\n}\r\n\r\n\r\n.pickup-next{\r\n  right:-19px;\r\n}\r\n\r\n\r\n.pickup-arrow:hover{\r\n  background:var(--navy);\r\n  color:#fff;\r\n  border-color:var(--navy);\r\n}\r\n\r\n\r\n\/* DOTS *\/\r\n\r\n.pickup-dots{\r\n  display:flex !important;\r\n\r\n  align-items:center !important;\r\n  justify-content:center !important;\r\n\r\n  width:100% !important;\r\n\r\n  gap:9px;\r\n\r\n  margin:24px auto 0 !important;\r\n  padding:0 !important;\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-dot{\r\n  display:block !important;\r\n\r\n  flex:0 0 6px !important;\r\n\r\n  width:6px !important;\r\n  height:6px !important;\r\n\r\n  margin:0 !important;\r\n  padding:0 !important;\r\n\r\n  border:0 !important;\r\n  border-radius:50%;\r\n\r\n  background:var(--light-gray);\r\n\r\n  cursor:pointer;\r\n}\r\n\r\n\r\n.pickup-dot.is-active{\r\n  background:var(--navy);\r\n\r\n  transform:scale(1.3);\r\n}\r\n\r\n\r\n\/* INFO *\/\r\n\r\n.pickup-info{\r\n  display:block !important;\r\n\r\n  width:100% !important;\r\n  max-width:600px !important;\r\n\r\n  margin:45px auto 0 !important;\r\n  padding:0 !important;\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-item-number{\r\n  display:block !important;\r\n\r\n  width:100% !important;\r\n\r\n  margin:0 0 8px !important;\r\n  padding:0 !important;\r\n\r\n  font-family:Helvetica, Arial, sans-serif;\r\n  font-size:9px;\r\n\r\n  letter-spacing:.15em;\r\n  line-height:1.5;\r\n\r\n  color:var(--cool-gray);\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-item-name{\r\n  display:block !important;\r\n\r\n  width:100% !important;\r\n\r\n  margin:0 0 24px !important;\r\n  padding:0 !important;\r\n\r\n  font-family:\"Noto Serif JP\",serif;\r\n  font-size:16px;\r\n  font-weight:400;\r\n\r\n  line-height:1.8;\r\n\r\n  color:var(--navy);\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n.pickup-description{\r\n  display:block !important;\r\n\r\n  width:100% !important;\r\n  max-width:600px !important;\r\n\r\n  margin:0 auto !important;\r\n  padding:0 !important;\r\n\r\n  font-family:\"Noto Serif JP\",serif;\r\n  font-size:14px;\r\n\r\n  line-height:2.3;\r\n\r\n  color:var(--charcoal);\r\n\r\n  text-align:center !important;\r\n}\r\n\r\n\r\n\/* MOBILE *\/\r\n\r\n@media(max-width:768px){\r\n\r\n  .magazine-pickup{\r\n    margin-top:75px !important;\r\n  }\r\n\r\n  .pickup-heading{\r\n    margin-bottom:40px !important;\r\n  }\r\n\r\n  .pickup-title{\r\n    font-size:18px;\r\n  }\r\n\r\n  .pickup-slider-wrap{\r\n    max-width:100% !important;\r\n  }\r\n\r\n  .pickup-arrow{\r\n    width:32px !important;\r\n    height:32px !important;\r\n\r\n    font-size:12px;\r\n  }\r\n\r\n  .pickup-prev{\r\n    left:-8px;\r\n  }\r\n\r\n  .pickup-next{\r\n    right:-8px;\r\n  }\r\n\r\n  .pickup-info{\r\n    margin-top:35px !important;\r\n  }\r\n\r\n  .pickup-item-name{\r\n    font-size:15px;\r\n    margin-bottom:20px !important;\r\n  }\r\n\r\n  .pickup-description{\r\n    font-size:13px;\r\n    line-height:2.2;\r\n  }\r\n\r\n}\r\n\r\n\r\n\/* =========================================\r\n   PICKUP SLIDER\r\n========================================= *\/\r\n\r\n.pickup-slider-wrap {\r\n  position: relative;\r\n\r\n  width: 100%;\r\n  max-width: 650px;\r\n\r\n  margin: 0 auto !important;\r\n}\r\n\r\n.pickup-slider {\r\n  position: relative;\r\n\r\n  width: 100%;\r\n\r\n  overflow: hidden;\r\n\r\n  margin: 0 auto !important;\r\n\r\n  cursor: grab;\r\n\r\n  touch-action: pan-y;\r\n}\r\n\r\n.pickup-slider.is-dragging {\r\n  cursor: grabbing;\r\n}\r\n\r\n.pickup-track {\r\n  display: flex !important;\r\n\r\n  width: 100% !important;\r\n\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n\r\n  transform: translate3d(0,0,0);\r\n\r\n  transition:\r\n    transform .7s cubic-bezier(.22,.61,.36,1);\r\n}\r\n\r\n.pickup-slide {\r\n  flex: 0 0 100% !important;\r\n\r\n  width: 100% !important;\r\n  min-width: 100% !important;\r\n\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n}\r\n\r\n.pickup-image {\r\n  width: 100% !important;\r\n  max-width: 650px;\r\n\r\n  margin: 0 auto !important;\r\n  overflow: hidden;\r\n}\r\n\r\n.pickup-image img {\r\n  display: block !important;\r\n\r\n  width: 100% !important;\r\n  height: auto !important;\r\n\r\n  margin: 0 auto !important;\r\n\r\n  pointer-events: none;\r\n\r\n  user-select: none;\r\n  -webkit-user-drag: none;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   PICKUP ARROWS\r\n========================================= *\/\r\n\r\n.pickup-arrow {\r\n  position: absolute;\r\n  top: 50%;\r\n  z-index: 5;\r\n\r\n  width: 38px;\r\n  height: 38px;\r\n\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n\r\n  border: 1px solid rgba(38,54,77,.35);\r\n  border-radius: 50%;\r\n\r\n  background: rgba(255,255,255,.9);\r\n\r\n  color: var(--navy);\r\n\r\n  font-family: Arial, sans-serif;\r\n  font-size: 14px;\r\n\r\n  line-height: 36px;\r\n\r\n  cursor: pointer;\r\n\r\n  transform: translateY(-50%);\r\n\r\n  transition: .3s ease;\r\n}\r\n\r\n.pickup-prev {\r\n  left: -19px;\r\n}\r\n\r\n.pickup-next {\r\n  right: -19px;\r\n}\r\n\r\n.pickup-arrow:hover {\r\n  background: var(--navy);\r\n  color: #fff;\r\n  border-color: var(--navy);\r\n\r\n  transform: translateY(-50%) scale(1.04);\r\n}\r\n\r\n\r\n\/* =========================================\r\n   PICKUP DOTS\r\n========================================= *\/\r\n\r\n.pickup-dots {\r\n  display: flex !important;\r\n\r\n  justify-content: center;\r\n  align-items: center;\r\n\r\n  gap: 9px;\r\n\r\n  margin: 24px auto 0 !important;\r\n  padding: 0 !important;\r\n}\r\n\r\n.pickup-dot {\r\n  display: block;\r\n\r\n  width: 6px;\r\n  height: 6px;\r\n\r\n  padding: 0 !important;\r\n  margin: 0 !important;\r\n\r\n  border: 0;\r\n  border-radius: 50%;\r\n\r\n  background: var(--light-gray);\r\n\r\n  cursor: pointer;\r\n\r\n  transition: .3s ease;\r\n}\r\n\r\n.pickup-dot.is-active {\r\n  background: var(--navy);\r\n  transform: scale(1.3);\r\n}\r\n\r\n\r\n\/* =========================================\r\n   PICKUP INFO\r\n========================================= *\/\r\n\r\n.pickup-info {\r\n  width: 100%;\r\n  max-width: 600px;\r\n\r\n  margin: 40px auto 0 !important;\r\n  padding: 0 !important;\r\n}\r\n\r\n.pickup-item-number {\r\n  margin: 0 0 8px !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: 9px;\r\n  letter-spacing: .15em;\r\n\r\n  color: var(--cool-gray);\r\n}\r\n\r\n.pickup-item-name {\r\n  margin: 0 0 22px !important;\r\n\r\n  font-family: \"Noto Serif JP\", serif;\r\n  font-size: 16px;\r\n  font-weight: 400;\r\n  line-height: 1.8;\r\n\r\n  color: var(--navy);\r\n}\r\n\r\n.pickup-description {\r\n  width: 100%;\r\n  max-width: 600px;\r\n\r\n  margin: 0 auto !important;\r\n\r\n  font-family: \"Noto Serif JP\", serif;\r\n  font-size: 14px;\r\n  line-height: 2.3;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   ITEMS\r\n========================================= *\/\r\n\r\n.look-items {\r\n  width: 100%;\r\n\r\n  margin: 90px auto 0 !important;\r\n\r\n  text-align: center !important;\r\n}\r\n\r\n.items-title {\r\n  margin: 0 0 35px !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: 11px;\r\n  font-weight: 400;\r\n  letter-spacing: .18em;\r\n\r\n  color: var(--navy);\r\n}\r\n\r\n\r\n\/* =========================================\r\n   ITEMS SLIDER\r\n========================================= *\/\r\n\r\n.items-slider {\r\n  position: relative;\r\n\r\n  width: 100%;\r\n\r\n  overflow: hidden !important;\r\n\r\n  cursor: grab;\r\n\r\n  touch-action: pan-y;\r\n}\r\n\r\n.items-slider.is-dragging {\r\n  cursor: grabbing;\r\n}\r\n\r\n.items-track {\r\n  display: flex !important;\r\n  flex-wrap: nowrap !important;\r\n\r\n  width: max-content !important;\r\n\r\n  gap: 35px;\r\n\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n\r\n  align-items: flex-start;\r\n\r\n  will-change: transform;\r\n\r\n  user-select: none;\r\n  -webkit-user-select: none;\r\n}\r\n\r\n.item {\r\n  flex: 0 0 250px !important;\r\n\r\n  width: 250px !important;\r\n  min-width: 250px !important;\r\n\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n\r\n  text-align: center !important;\r\n\r\n  transition: transform .4s ease;\r\n}\r\n\r\n.item:hover {\r\n  transform: translateY(-4px);\r\n}\r\n\r\n.item-image {\r\n  width: 100% !important;\r\n\r\n  margin: 0 auto !important;\r\n  padding: 0 !important;\r\n\r\n  overflow: hidden;\r\n}\r\n\r\n.item-image a {\r\n  display: block;\r\n\r\n  width: 100%;\r\n\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.item-image img {\r\n  display: block !important;\r\n\r\n  width: 100% !important;\r\n  max-width: 100% !important;\r\n  height: auto !important;\r\n\r\n  margin: 0 auto !important;\r\n\r\n  pointer-events: none;\r\n\r\n  transition:\r\n    transform .8s cubic-bezier(.22,.61,.36,1);\r\n}\r\n\r\n.item:hover .item-image img {\r\n  transform: scale(1.02);\r\n}\r\n\r\n.item-number {\r\n  margin: 18px 0 8px !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: 9px;\r\n  font-weight: 400;\r\n  letter-spacing: .15em;\r\n\r\n  color: var(--cool-gray);\r\n}\r\n\r\n.item-name {\r\n  margin: 0 !important;\r\n\r\n  font-family: \"Noto Serif JP\", serif;\r\n  font-size: 12px;\r\n  line-height: 1.8;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   END\r\n========================================= *\/\r\n\r\n.magazine-end {\r\n  width: 100%;\r\n\r\n  padding: 120px 0 20px;\r\n\r\n  border-top: 1px solid rgba(138,146,156,.3);\r\n\r\n  text-align: center !important;\r\n}\r\n\r\n.magazine-end-motion {\r\n  opacity: 0;\r\n  transform: translateY(30px);\r\n\r\n  transition:\r\n    opacity 1s ease,\r\n    transform 1.1s cubic-bezier(.22,.61,.36,1);\r\n}\r\n\r\n.magazine-end-motion.is-visible {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n.magazine-end-title {\r\n  margin: 0 !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: clamp(20px,3vw,32px);\r\n  font-weight: 400;\r\n  letter-spacing: .1em;\r\n  line-height: 1.5;\r\n\r\n  color: var(--navy);\r\n}\r\n\r\n.magazine-end-link {\r\n  display: inline-block !important;\r\n\r\n  margin: 40px auto 0 !important;\r\n  padding: 14px 28px;\r\n\r\n  border: 1px solid var(--navy);\r\n\r\n  color: var(--navy) !important;\r\n\r\n  text-decoration: none !important;\r\n\r\n  font-family: Helvetica, Arial, sans-serif;\r\n  font-size: 10px;\r\n  letter-spacing: .15em;\r\n\r\n  transition: .3s ease;\r\n}\r\n\r\n.magazine-end-link:hover {\r\n  background: var(--navy);\r\n  color: #fff !important;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   MOBILE\r\n========================================= *\/\r\n\r\n@media (max-width: 768px) {\r\n\r\n  .magazine-feature {\r\n    padding: 0 18px 80px !important;\r\n  }\r\n\r\n  .magazine-hero {\r\n    padding: 70px 0 90px;\r\n  }\r\n\r\n  .magazine-hero-image {\r\n    margin-top: 45px !important;\r\n  }\r\n\r\n  .magazine-intro {\r\n    padding-bottom: 80px;\r\n  }\r\n\r\n  .magazine-intro-text {\r\n    font-size: 13px;\r\n    line-height: 2.2;\r\n  }\r\n\r\n  .magazine-look {\r\n    padding: 80px 0 90px;\r\n  }\r\n\r\n  .look-image {\r\n    margin-top: 40px !important;\r\n  }\r\n\r\n  .look-comment {\r\n    margin-top: 35px !important;\r\n\r\n    font-size: 13px;\r\n    line-height: 2.2;\r\n  }\r\n\r\n  .magazine-pickup {\r\n    margin-top: 75px !important;\r\n    padding-top: 60px !important;\r\n  }\r\n\r\n  .pickup-heading {\r\n    margin-bottom: 35px !important;\r\n  }\r\n\r\n  .pickup-title {\r\n    font-size: 18px;\r\n  }\r\n\r\n  .pickup-prev {\r\n    left: -8px;\r\n  }\r\n\r\n  .pickup-next {\r\n    right: -8px;\r\n  }\r\n\r\n  .pickup-arrow {\r\n    width: 32px;\r\n    height: 32px;\r\n\r\n    font-size: 12px;\r\n    line-height: 30px;\r\n  }\r\n\r\n  .pickup-info {\r\n    margin-top: 35px !important;\r\n  }\r\n\r\n  .pickup-item-name {\r\n    font-size: 15px;\r\n    margin-bottom: 20px !important;\r\n  }\r\n\r\n  .pickup-description {\r\n    font-size: 13px;\r\n    line-height: 2.2;\r\n  }\r\n\r\n  .look-items {\r\n    margin-top: 70px !important;\r\n  }\r\n\r\n  .items-title {\r\n    margin-bottom: 28px !important;\r\n  }\r\n\r\n  .items-track {\r\n    gap: 18px;\r\n  }\r\n\r\n  .item {\r\n    flex: 0 0 78vw !important;\r\n\r\n    width: 78vw !important;\r\n    min-width: 78vw !important;\r\n  }\r\n\r\n  .item-name {\r\n    font-size: 11px;\r\n  }\r\n\r\n  .magazine-end {\r\n    padding-top: 90px;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n<section class=\"magazine-feature\">\r\n\r\n  <div class=\"magazine-inner\">\r\n\r\n    <!-- =====================================\r\n         HERO\r\n    ====================================== -->\r\n\r\n    <div class=\"magazine-hero\">\r\n\r\n      <p class=\"magazine-eyebrow\">\r\n        FEATURED IN\r\n      <\/p>\r\n\r\n      <h1 class=\"magazine-title\">\r\n        FUDGE\r\n      <\/h1>\r\n\r\n      <p class=\"magazine-date\">\r\n        OCTOBER 2026\r\n      <\/p>\r\n\r\n      <div class=\"magazine-hero-image magazine-image-fade\">\r\n\r\n        <img decoding=\"async\"\r\n          src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/H1_279.jpg\"\r\n          alt=\"FUDGE magazine\"\r\n        >\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- =====================================\r\n         INTRO\r\n    ====================================== -->\r\n\r\n    <div class=\"magazine-intro magazine-intro-motion\">\r\n\r\n      <h2 class=\"magazine-intro-title\">\r\n        FROM THE MAGAZINE\r\n      <\/h2>\r\n\r\n      <p class=\"magazine-intro-text\">\r\n        \u96d1\u8a8c\u300eFUDGE\u300f\u306b\u63b2\u8f09\u3055\u308c\u305f\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u304b\u3089\u3001<br>\r\n        \u4f7f\u7528\u30a2\u30a4\u30c6\u30e0\u3092\u30d4\u30c3\u30af\u30a2\u30c3\u30d7\u3002\r\n      <\/p>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- =====================================\r\n         LOOK 01\r\n    ====================================== -->\r\n\r\n    <section class=\"magazine-look\">\r\n\r\n      <div class=\"look-heading-motion\">\r\n\r\n        <p class=\"look-number\">\r\n          LOOK 01\r\n        <\/p>\r\n\r\n        <h2 class=\"look-title\">\r\n          MAGAZINE STYLE\r\n        <\/h2>\r\n\r\n      <\/div>\r\n\r\n\r\n      <div class=\"look-image magazine-image-fade\">\r\n\r\n        <img decoding=\"async\"\r\n          src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/260907_F-GMD95118.jpg\"\r\n          alt=\"LOOK 01\"\r\n        >\r\n\r\n      <\/div>\r\n\r\n\r\n      <p class=\"look-comment\">\r\n        \u304a\u3059\u3059\u3081\u306e\u30ad\u30eb\u30c6\u30a3\u30f3\u30b0\u30b3\u30fc\u30c8\u306f\u3001<br>\r\n        \u68b3\u6bdb\u30a6\u30fc\u30eb\u6df7\u306e\u30a6\u30fc\u30eb\u30c7\u30cb\u30e0\u3092\u4f7f\u7528\u3057\u305f\u4e0a\u54c1\u3055\u306e\u3042\u308b\u5370\u8c61\u3002<br>\r\n        \u69d8\u3005\u306a\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u306b\u30d5\u30a3\u30c3\u30c8\u3057\u3066\u65e5\u5e38\u306b\u6eb6\u3051\u8fbc\u3080\u30a2\u30a4\u30c6\u30e0\u3067\u3059\u3002\r\n      <\/p>\r\n\r\n\r\n  <section class=\"magazine-pickup\">\r\n\r\n  <div class=\"pickup-heading\">\r\n    <p class=\"pickup-number\">\r\n      PICK UP\r\n    <\/p>\r\n\r\n    <h3 class=\"pickup-title\">\r\n      FEATURED ITEM\r\n    <\/h3>\r\n  <\/div>\r\n\r\n\r\n  <!-- \u5546\u54c1\u30c6\u30ad\u30b9\u30c8\u3092\u5148\u306b\u3059\u308b -->\r\n  <div class=\"pickup-info\">\r\n\r\n    <p class=\"pickup-item-number\">\r\n      PICK UP ITEM\r\n    <\/p>\r\n\r\n    <h4 class=\"pickup-item-name\">\r\n      \u30b3\u30fc\u30c7\u30e5\u30ed\u30a4\u887f\u30ad\u30eb\u30c6\u30a3\u30f3\u30b0\u30b3\u30fc\u30c8\r\n    <\/h4>\r\n\r\n    <p class=\"pickup-description\">\r\n      \u68b3\u6bdb\u30a6\u30fc\u30eb\u6df7\u306e\u4e0a\u8cea\u306a\u30a6\u30fc\u30eb\u30c7\u30cb\u30e0\u3092\u4f7f\u7528\u3057\u305f\u3001\u30df\u30c9\u30eb\u4e08\u306e\u30ad\u30eb\u30c6\u30a3\u30f3\u30b0\u30b3\u30fc\u30c8\u3002<br>\r\n\u30b3\u30fc\u30c7\u30e5\u30ed\u30a4\u306e\u30d1\u30a4\u30d4\u30f3\u30b0\u3084\u30d5\u30e9\u30c3\u30d7\u304c\u30a2\u30af\u30bb\u30f3\u30c8\u306b\u306a\u3063\u305f\u3001\u4e0a\u54c1\u3067\u3059\u3063\u304d\u308a\u3068\u3057\u305f\u30c7\u30b6\u30a4\u30f3\u3067\u3059\u3002\r\n\u4e2d\u7dbf\u306b\u306f\u4fdd\u6e29\u30fb\u6297\u83cc\u30fb\u9759\u96fb\u9632\u6b62\u6a5f\u80fd\u3092\u5099\u3048\u305f\u300cWARM ASSIST AG\u00ae\u300d\u3092\u4f7f\u7528\u3057\u3001\u5feb\u9069\u306a\u7740\u5fc3\u5730\u3092\u53f6\u3048\u307e\u3059\u3002\r\n    <\/p>\r\n\r\n  <\/div>\r\n\r\n\r\n  <!-- \u753b\u50cf\u3092\u5f8c\u306b\u3059\u308b -->\r\n  <div class=\"pickup-slider-wrap\">\r\n\r\n    <button\r\n      class=\"pickup-arrow pickup-prev\"\r\n      type=\"button\"\r\n      aria-label=\"Previous image\"\r\n    >\r\n      \u2190\r\n    <\/button>\r\n\r\n    <div class=\"pickup-slider\">\r\n\r\n      <div class=\"pickup-track\">\r\n\r\n        <div class=\"pickup-slide\">\r\n          <div class=\"pickup-image\">\r\n            <img decoding=\"async\"\r\n              src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GO2630131_6.png\"\r\n              alt=\"\u30b3\u30fc\u30c7\u30e5\u30ed\u30a4\u887f\u30ad\u30eb\u30c6\u30a3\u30f3\u30b0\u30b3\u30fc\u30c8\"\r\n            >\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"pickup-slide\">\r\n          <div class=\"pickup-image\">\r\n            <img decoding=\"async\"\r\n              src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GO2630131_14.png\"\r\n              alt=\"\u30b3\u30fc\u30c7\u30e5\u30ed\u30a4\u887f\u30ad\u30eb\u30c6\u30a3\u30f3\u30b0\u30b3\u30fc\u30c8\"\r\n            >\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"pickup-slide\">\r\n          <div class=\"pickup-image\">\r\n            <img decoding=\"async\"\r\n              src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GO2630131_1.png\"\r\n              alt=\"\u30b3\u30fc\u30c7\u30e5\u30ed\u30a4\u887f\u30ad\u30eb\u30c6\u30a3\u30f3\u30b0\u30b3\u30fc\u30c8\"\r\n            >\r\n          <\/div>\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n    <button\r\n      class=\"pickup-arrow pickup-next\"\r\n      type=\"button\"\r\n      aria-label=\"Next image\"\r\n    >\r\n      \u2192\r\n    <\/button>\r\n\r\n  <\/div>\r\n\r\n\r\n  <div class=\"pickup-dots\">\r\n\r\n    <button\r\n      class=\"pickup-dot is-active\"\r\n      type=\"button\"\r\n      aria-label=\"Image 1\"\r\n    ><\/button>\r\n\r\n    <button\r\n      class=\"pickup-dot\"\r\n      type=\"button\"\r\n      aria-label=\"Image 2\"\r\n    ><\/button>\r\n\r\n    <button\r\n      class=\"pickup-dot\"\r\n      type=\"button\"\r\n      aria-label=\"Image 3\"\r\n    ><\/button>\r\n\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n      <!-- =====================================\r\n           LOOK 01 ITEMS\r\n      ====================================== -->\r\n\r\n      <div class=\"look-items\">\r\n\r\n        <h3 class=\"items-title\">\r\n          ITEMS IN THIS LOOK\r\n        <\/h3>\r\n\r\n\r\n        <div class=\"items-slider\">\r\n\r\n          <div class=\"items-track\">\r\n\r\n\r\n            <!-- ITEM 01 -->\r\n\r\n            <div class=\"item\">\r\n\r\n              <div class=\"item-image\">\r\n\r\n                <a href=\"https:\/\/www.grandmama-and-kato.com\/SHOP\/266GO2630131.html\">\r\n\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GO2630131_1.png\"\r\n                    alt=\"\u30b3\u30fc\u30c7\u30e5\u30ed\u30a4\u887f\u30ad\u30eb\u30c6\u30a3\u30f3\u30b0\u30b3\u30fc\u30c8\"\r\n                  >\r\n\r\n                <\/a>\r\n\r\n              <\/div>\r\n\r\n              <p class=\"item-number\">\r\n                01 \/ OUTER\r\n              <\/p>\r\n\r\n              <p class=\"item-name\">\r\n                \u30b3\u30fc\u30c7\u30e5\u30ed\u30a4\u887f\u30ad\u30eb\u30c6\u30a3\u30f3\u30b0\u30b3\u30fc\u30c8\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n            <!-- ITEM 02 -->\r\n\r\n            <div class=\"item\">\r\n\r\n              <div class=\"item-image\">\r\n\r\n                <a href=\"https:\/\/www.grandmama-and-kato.com\/SHOP\/266GN2633711.html\">\r\n\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GN2633711_5.png\"\r\n                    alt=\"\u30b3\u30c3\u30c8\u30f3\u30ea\u30d6\u30d8\u30f3\u30ea\u30fc\u30cd\u30c3\u30af\u30cb\u30c3\u30c8\"\r\n                  >\r\n\r\n                <\/a>\r\n\r\n              <\/div>\r\n\r\n              <p class=\"item-number\">\r\n                02 \/ TOPS\r\n              <\/p>\r\n\r\n              <p class=\"item-name\">\r\n                \u30b3\u30c3\u30c8\u30f3\u30ea\u30d6\u30d8\u30f3\u30ea\u30fc\u30cd\u30c3\u30af\u30cb\u30c3\u30c8\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n            <!-- ITEM 03 -->\r\n\r\n            \r\n<div class=\"item\">\r\n\r\n  <div class=\"item-image\">\r\n\r\n    <a href=\"https:\/\/www.grandmama-and-kato.com\/SHOP\/266GP2634431.html\">\r\n      <img decoding=\"async\"\r\n        src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/limg\/GP2634431_1.png\"\r\n        alt=\"\u30d5\u30e9\u30ce\u5207\u66ff\u30d0\u30ec\u30eb\u30d1\u30f3\u30c4\uff0811\u6708\u767a\u58f2\uff09\"\r\n      >\r\n    <\/a>\r\n\r\n  <\/div>\r\n\r\n  <p class=\"item-number\">\r\n    03 \/ BOTTOMS\r\n  <\/p>\r\n\r\n  <p class=\"item-name\">\r\n    \u30d5\u30e9\u30ce\u5207\u66ff\u30d0\u30ec\u30eb\u30d1\u30f3\u30c4\uff0811\u6708\u767a\u58f2\uff09\r\n  <\/p>\r\n\r\n<\/div>\r\n\r\n\r\n            <!-- ITEM 04 -->\r\n\r\n            <div class=\"item\">\r\n\r\n              <div class=\"item-image\">\r\n\r\n                <a href=\"https:\/\/www.grandmama-and-kato.com\/SHOP\/266GS2634951.html\">\r\n\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GS2634951_2.png\"\r\n                    alt=\"\u30b7\u30e3\u30f3\u30d6\u30ec\u30fc\u30e9\u30a6\u30f3\u30c9\u30ab\u30e9\u30fc\u30d0\u30c3\u30af\u30ae\u30e3\u30b6\u30fc\u30b7\u30e3\u30c4\"\r\n                  >\r\n\r\n                <\/a>\r\n\r\n              <\/div>\r\n\r\n              <p class=\"item-number\">\r\n                04 \/ ITEM\r\n              <\/p>\r\n\r\n              <p class=\"item-name\">\r\n                \u30b7\u30e3\u30f3\u30d6\u30ec\u30fc\u30e9\u30a6\u30f3\u30c9\u30ab\u30e9\u30fc\u30d0\u30c3\u30af\u30ae\u30e3\u30b6\u30fc\u30b7\u30e3\u30c4\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n    <\/section>\r\n\r\n\r\n    <!-- =====================================\r\n         LOOK 02\r\n    ====================================== -->\r\n\r\n    <section class=\"magazine-look\">\r\n\r\n      <div class=\"look-heading-motion\">\r\n\r\n        <p class=\"look-number\">\r\n          LOOK 02\r\n        <\/p>\r\n\r\n        <h2 class=\"look-title\"><br>\r\n          MAGAZINE STYLE\r\n        <\/h2>\r\n\r\n      <\/div>\r\n\r\n\r\n      <div class=\"look-image magazine-image-fade\">\r\n\r\n        <img decoding=\"async\"\r\n          src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/260907_F-GMD95402.jpg\"\r\n          alt=\"LOOK 02\"\r\n        >\r\n\r\n      <\/div>\r\n\r\n\r\n      <p class=\"look-comment\">\r\n        \u3053\u306e\u79cb\u306f\u30c7\u30cb\u30e0\u30b8\u30e3\u30b1\u30c3\u30c8\u3068\u30b9\u30ab\u30fc\u30c8\u3092\u30bb\u30c3\u30c8\u30a2\u30c3\u30d7\u3067\uff01\r\n        \u99b4\u67d3\u307f\u306e\u826f\u3044\u77ed\u4e08\u304c\u65b0\u9bae\u306a\u30c7\u30cb\u30e0\u30b8\u30e3\u30b1\u30c3\u30c8\u306f\r\n        \u30dc\u30ea\u30e5\u30fc\u30e0\u30b9\u30ab\u30fc\u30c8\u3068\u76f8\u6027\u30d0\u30c3\u30c1\u30ea\u3002<br>\r\n        \u30ab\u30b8\u30e5\u30a2\u30eb\u306a\u5370\u8c61\u3082\u30c6\u30fc\u30e9\u30fc\u30c9\u30b8\u30e3\u30b1\u30c3\u30c8\u3092\u7fbd\u7e54\u3063\u3066\r\n        \u30af\u30e9\u30b7\u30c3\u30af\u306a\u30b9\u30bf\u30a4\u30eb\u3092\u697d\u3057\u3093\u3067\u3002\r\n      <\/p>\r\n\r\n<section class=\"magazine-pickup\">\r\n\r\n  <div class=\"pickup-heading\">\r\n\r\n    <p class=\"pickup-number\">\r\n      PICK UP\r\n    <\/p>\r\n\r\n    <h3 class=\"pickup-title\">\r\n      FEATURED ITEM\r\n    <\/h3>\r\n\r\n  <\/div>\r\n\r\n\r\n  <div class=\"pickup-slider-wrap\">\r\n\r\n    <button\r\n      class=\"pickup-arrow pickup-prev\"\r\n      type=\"button\"\r\n      aria-label=\"Previous image\"\r\n    >\r\n      \u2190\r\n    <\/button>\r\n\r\n\r\n    <div class=\"pickup-slider\">\r\n\r\n      <div class=\"pickup-track\">\r\n\r\n        <div class=\"pickup-slide\">\r\n\r\n          <div class=\"pickup-image\">\r\n\r\n            <img decoding=\"async\"\r\n              src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GJ263389U1_5.png\"\r\n              alt=\"10oz\u30c7\u30cb\u30e0\u30b9\u30ca\u30c3\u30d7\u30dc\u30bf\u30f3\u30b8\u30e3\u30b1\u30c3\u30c8\"\r\n            >\r\n\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"pickup-slide\">\r\n\r\n          <div class=\"pickup-image\">\r\n\r\n            <img decoding=\"async\"\r\n              src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GJ263389U1_6.png\"\r\n              alt=\"10oz\u30c7\u30cb\u30e0\u30b9\u30ca\u30c3\u30d7\u30dc\u30bf\u30f3\u30b8\u30e3\u30b1\u30c3\u30c8\"\r\n            >\r\n\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"pickup-slide\">\r\n\r\n          <div class=\"pickup-image\">\r\n\r\n            <img decoding=\"async\"\r\n              src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GJ263389U1_1.png\"\r\n              alt=\"10oz\u30c7\u30cb\u30e0\u30b9\u30ca\u30c3\u30d7\u30dc\u30bf\u30f3\u30b8\u30e3\u30b1\u30c3\u30c8\"\r\n            >\r\n\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <button\r\n      class=\"pickup-arrow pickup-next\"\r\n      type=\"button\"\r\n      aria-label=\"Next image\"\r\n    >\r\n      \u2192\r\n    <\/button>\r\n\r\n  <\/div>\r\n\r\n\r\n  <div class=\"pickup-dots\">\r\n\r\n    <button\r\n      class=\"pickup-dot is-active\"\r\n      type=\"button\"\r\n      aria-label=\"Image 1\"\r\n    ><\/button>\r\n\r\n    <button\r\n      class=\"pickup-dot\"\r\n      type=\"button\"\r\n      aria-label=\"Image 2\"\r\n    ><\/button>\r\n\r\n    <button\r\n      class=\"pickup-dot\"\r\n      type=\"button\"\r\n      aria-label=\"Image 3\"\r\n    ><\/button>\r\n\r\n  <\/div>\r\n\r\n\r\n  <div class=\"pickup-info\">\r\n\r\n    <p class=\"pickup-item-number\">\r\n      PICK UP ITEM\r\n    <\/p>\r\n\r\n    <h4 class=\"pickup-item-name\">\r\n      10oz\u30c7\u30cb\u30e0\u30b9\u30ca\u30c3\u30d7\u30dc\u30bf\u30f3\u30b8\u30e3\u30b1\u30c3\u30c8\r\n    <\/h4>\r\n\r\n    <p class=\"pickup-description\">\r\n      \u7a0b\u3088\u3044\u539a\u307f\u306e\u30c7\u30cb\u30e0\u7d20\u6750\u3092\u4f7f\u7528\u3057\u305f\u3001\r\n      \u5b63\u7bc0\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u306b\u53d6\u308a\u5165\u308c\u3084\u3059\u3044\u30b8\u30e3\u30b1\u30c3\u30c8\u3002\r\n      \u30bb\u30c3\u30c8\u30a2\u30c3\u30d7\u3067\u306e\u7740\u7528\u306f\u3082\u3061\u308d\u3093\u3001\r\n      \u69d8\u3005\u306a\u30a2\u30a4\u30c6\u30e0\u3068\u5408\u308f\u305b\u3066\u697d\u3057\u3081\u307e\u3059\u3002\r\n    <\/p>\r\n\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n\r\n      <!-- =====================================\r\n           LOOK 02 ITEMS\r\n      ====================================== -->\r\n\r\n      <div class=\"look-items\">\r\n\r\n        <h3 class=\"items-title\">\r\n          ITEMS IN THIS LOOK\r\n        <\/h3>\r\n\r\n\r\n        <div class=\"items-slider\">\r\n\r\n          <div class=\"items-track\">\r\n\r\n\r\n            <!-- ITEM 01 -->\r\n\r\n            \r\n<div class=\"item\">\r\n\r\n  <div class=\"item-image\">\r\n\r\n    <a href=\"https:\/\/www.grandmama-and-kato.com\/SHOP\/266GJ2633911.html\">\r\n      <img decoding=\"async\"\r\n        src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GJ2633911_3.png\"\r\n        alt=\"\u30a6\u30fc\u30eb\u30c6\u30fc\u30e9\u30fc\u30c9\u30b8\u30e3\u30b1\u30c3\u30c8\"\r\n      >\r\n    <\/a>\r\n\r\n  <\/div>\r\n\r\n  <p class=\"item-number\">\r\n    01 \/ OUTER\r\n  <\/p>\r\n\r\n  <p class=\"item-name\">\r\n    \u30a6\u30fc\u30eb\u30c6\u30fc\u30e9\u30fc\u30c9\u30b8\u30e3\u30b1\u30c3\u30c8\uff0811\u6708\u767a\u58f2\uff09\r\n  <\/p>\r\n\r\n<\/div>\r\n\r\n\r\n            <!-- ITEM 02 -->\r\n\r\n            <div class=\"item\">\r\n\r\n              <div class=\"item-image\">\r\n\r\n                <a href=\"https:\/\/www.grandmama-and-kato.com\/SHOP\/266GJ263389U1.html\">\r\n\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GJ263389U1_1.png\"\r\n                    alt=\"10oz\u30c7\u30cb\u30e0\u30b9\u30ca\u30c3\u30d7\u30dc\u30bf\u30f3\u30b8\u30e3\u30b1\u30c3\u30c8\"\r\n                  >\r\n\r\n                <\/a>\r\n\r\n              <\/div>\r\n\r\n              <p class=\"item-number\">\r\n                02 \/ JACKET\r\n              <\/p>\r\n\r\n              <p class=\"item-name\">\r\n                10oz\u30c7\u30cb\u30e0\u30b9\u30ca\u30c3\u30d7\u30dc\u30bf\u30f3\u30b8\u30e3\u30b1\u30c3\u30c8\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n            <!-- ITEM 03 -->\r\n\r\n            <div class=\"item\">\r\n\r\n              <div class=\"item-image\">\r\n\r\n                <a href=\"https:\/\/www.grandmama-and-kato.com\/SHOP\/266GK263262U1.html\">\r\n\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GK263262U1_1.png\"\r\n                    alt=\"10oz\u30c7\u30cb\u30e0\u30bf\u30c3\u30af\u30ed\u30f3\u30b0\u30b9\u30ab\u30fc\u30c8\"\r\n                  >\r\n\r\n                <\/a>\r\n\r\n              <\/div>\r\n\r\n              <p class=\"item-number\">\r\n                03 \/ BOTTOMS\r\n              <\/p>\r\n\r\n              <p class=\"item-name\">\r\n                10oz\u30c7\u30cb\u30e0\u30bf\u30c3\u30af\u30ed\u30f3\u30b0\u30b9\u30ab\u30fc\u30c8\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n            <!-- ITEM 04 -->\r\n\r\n            <div class=\"item\">\r\n\r\n              <div class=\"item-image\">\r\n\r\n                <a href=\"https:\/\/www.grandmama-and-kato.com\/SHOP\/266GC2637481.html\">\r\n\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/www.grandmama-and-kato.com\/pic-labo\/llimg\/GC2637481_4.png\"\r\n                    alt=\"\u30b7\u30a2\u30fc\u30cf\u30a4\u30cd\u30c3\u30af\u30a4\u30f3\u30ca\u30fc\"\r\n                  >\r\n\r\n                <\/a>\r\n\r\n              <\/div>\r\n\r\n              <p class=\"item-number\">\r\n                04 \/ TOPS\r\n              <\/p>\r\n\r\n              <p class=\"item-name\">\r\n                \u30b7\u30a2\u30fc\u30cf\u30a4\u30cd\u30c3\u30af\u30a4\u30f3\u30ca\u30fc\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n    <\/section>\r\n\r\n\r\n    <!-- =====================================\r\n         END\r\n    ====================================== -->\r\n\r\n    <div class=\"magazine-end magazine-end-motion\">\r\n\r\n      <h2 class=\"magazine-end-title\">\r\n        FROM THE PAGES<br>\r\n        TO YOUR WARDROBE\r\n      <\/h2>\r\n\r\n      <a\r\n        href=\"https:\/\/www.grandmama-and-kato.com\/SHOP\/227657\/227743\/list.html\"\r\n        class=\"magazine-end-link\"\r\n      >\r\n        VIEW MORE \u3009\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function () {\r\n\r\n  \/* =========================================\r\n     IMAGE \/ TEXT REVEAL\r\n  ========================================= *\/\r\n\r\n  const revealTargets = document.querySelectorAll(\r\n    \".magazine-image-fade, \" +\r\n    \".magazine-intro-motion, \" +\r\n    \".look-heading-motion, \" +\r\n    \".magazine-end-motion\"\r\n  );\r\n\r\n  if (\"IntersectionObserver\" in window) {\r\n\r\n    const observer = new IntersectionObserver(function (entries) {\r\n\r\n      entries.forEach(function (entry) {\r\n\r\n        if (entry.isIntersecting) {\r\n\r\n          entry.target.classList.add(\"is-visible\");\r\n\r\n          observer.unobserve(entry.target);\r\n\r\n        }\r\n\r\n      });\r\n\r\n    }, {\r\n      threshold: 0.05,\r\n      rootMargin: \"0px 0px -30px 0px\"\r\n    });\r\n\r\n\r\n    revealTargets.forEach(function (target) {\r\n      observer.observe(target);\r\n    });\r\n\r\n  } else {\r\n\r\n    revealTargets.forEach(function (target) {\r\n      target.classList.add(\"is-visible\");\r\n    });\r\n\r\n  }\r\n\r\n\r\n\r\n  \/* =========================================\r\n     LOOK ITEMS\r\n     AUTO SCROLL + DRAG + SWIPE\r\n  ========================================= *\/\r\n\r\n  document.querySelectorAll(\".items-slider\").forEach(function (slider) {\r\n\r\n    const track = slider.querySelector(\".items-track\");\r\n\r\n    if (!track) return;\r\n\r\n\r\n    const originalItems = Array.from(track.children);\r\n\r\n    if (!originalItems.length) return;\r\n\r\n\r\n    \/* -----------------------------------------\r\n       \u65e2\u5b58clone\u304c\u3042\u308c\u3070\u524a\u9664\r\n    ----------------------------------------- *\/\r\n\r\n    track.querySelectorAll(\".is-clone\").forEach(function (clone) {\r\n      clone.remove();\r\n    });\r\n\r\n\r\n    \/* -----------------------------------------\r\n       \u5546\u54c1\u3092\u8907\u88fd\r\n    ----------------------------------------- *\/\r\n\r\n    originalItems.forEach(function (item) {\r\n\r\n      const clone = item.cloneNode(true);\r\n\r\n      clone.classList.add(\"is-clone\");\r\n\r\n      clone.setAttribute(\"aria-hidden\", \"true\");\r\n\r\n      track.appendChild(clone);\r\n\r\n    });\r\n\r\n\r\n    let position = 0;\r\n\r\n    let loopWidth = 0;\r\n\r\n    let animationId = null;\r\n\r\n    let paused = false;\r\n\r\n    let dragging = false;\r\n\r\n    let startX = 0;\r\n\r\n    let startPosition = 0;\r\n\r\n\r\n    \/* -----------------------------------------\r\n       \u30eb\u30fc\u30d7\u5e45\r\n    ----------------------------------------- *\/\r\n\r\n    function calculateLoopWidth() {\r\n\r\n      if (!track.children[originalItems.length]) {\r\n        return;\r\n      }\r\n\r\n\r\n      const firstClone =\r\n        track.children[originalItems.length];\r\n\r\n\r\n      loopWidth =\r\n        firstClone.offsetLeft;\r\n\r\n\r\n      if (loopWidth > 0) {\r\n\r\n        position =\r\n          position % loopWidth;\r\n\r\n      }\r\n\r\n    }\r\n\r\n\r\n    calculateLoopWidth();\r\n\r\n\r\n    window.addEventListener(\r\n      \"load\",\r\n      calculateLoopWidth\r\n    );\r\n\r\n\r\n    window.addEventListener(\r\n      \"resize\",\r\n      calculateLoopWidth\r\n    );\r\n\r\n\r\n    \/* -----------------------------------------\r\n       \u8868\u793a\r\n    ----------------------------------------- *\/\r\n\r\n    function render() {\r\n\r\n      track.style.transform =\r\n        \"translate3d(\" +\r\n        (-position) +\r\n        \"px,0,0)\";\r\n\r\n    }\r\n\r\n\r\n    \/* -----------------------------------------\r\n       AUTO\r\n    ----------------------------------------- *\/\r\n\r\n    function animate() {\r\n\r\n      if (\r\n        !paused &&\r\n        !dragging &&\r\n        loopWidth > 0\r\n      ) {\r\n\r\n        position += 0.5;\r\n\r\n\r\n        if (position >= loopWidth) {\r\n\r\n          position -= loopWidth;\r\n\r\n        }\r\n\r\n\r\n        render();\r\n\r\n      }\r\n\r\n\r\n      animationId =\r\n        requestAnimationFrame(animate);\r\n\r\n    }\r\n\r\n\r\n    \/* -----------------------------------------\r\n       MOUSE\r\n    ----------------------------------------- *\/\r\n\r\n    slider.addEventListener(\r\n      \"mousedown\",\r\n      function (e) {\r\n\r\n        dragging = true;\r\n\r\n        paused = true;\r\n\r\n        startX =\r\n          e.clientX;\r\n\r\n        startPosition =\r\n          position;\r\n\r\n        slider.classList.add(\r\n          \"is-dragging\"\r\n        );\r\n\r\n        e.preventDefault();\r\n\r\n      }\r\n    );\r\n\r\n\r\n    window.addEventListener(\r\n      \"mousemove\",\r\n      function (e) {\r\n\r\n        if (!dragging) return;\r\n\r\n\r\n        const distance =\r\n          startX - e.clientX;\r\n\r\n\r\n        position =\r\n          startPosition + distance;\r\n\r\n\r\n        while (\r\n          loopWidth > 0 &&\r\n          position >= loopWidth\r\n        ) {\r\n\r\n          position -= loopWidth;\r\n\r\n        }\r\n\r\n\r\n        while (\r\n          loopWidth > 0 &&\r\n          position < 0\r\n        ) {\r\n\r\n          position += loopWidth;\r\n\r\n        }\r\n\r\n\r\n        render();\r\n\r\n      }\r\n    );\r\n\r\n\r\n    window.addEventListener(\r\n      \"mouseup\",\r\n      function () {\r\n\r\n        if (!dragging) return;\r\n\r\n\r\n        dragging = false;\r\n\r\n        paused = false;\r\n\r\n        slider.classList.remove(\r\n          \"is-dragging\"\r\n        );\r\n\r\n      }\r\n    );\r\n\r\n\r\n    \/* -----------------------------------------\r\n       TOUCH \/ SWIPE\r\n    ----------------------------------------- *\/\r\n\r\n    let touchStartX = 0;\r\n\r\n    let touchStartPosition = 0;\r\n\r\n\r\n    slider.addEventListener(\r\n      \"touchstart\",\r\n      function (e) {\r\n\r\n        dragging = true;\r\n\r\n        paused = true;\r\n\r\n        touchStartX =\r\n          e.touches[0].clientX;\r\n\r\n        touchStartPosition =\r\n          position;\r\n\r\n        slider.classList.add(\r\n          \"is-dragging\"\r\n        );\r\n\r\n      },\r\n      {\r\n        passive: true\r\n      }\r\n    );\r\n\r\n\r\n    slider.addEventListener(\r\n      \"touchmove\",\r\n      function (e) {\r\n\r\n        if (!dragging) return;\r\n\r\n\r\n        const currentX =\r\n          e.touches[0].clientX;\r\n\r\n\r\n        const distance =\r\n          touchStartX - currentX;\r\n\r\n\r\n        position =\r\n          touchStartPosition + distance;\r\n\r\n\r\n        while (\r\n          loopWidth > 0 &&\r\n          position >= loopWidth\r\n        ) {\r\n\r\n          position -= loopWidth;\r\n\r\n        }\r\n\r\n\r\n        while (\r\n          loopWidth > 0 &&\r\n          position < 0\r\n        ) {\r\n\r\n          position += loopWidth;\r\n\r\n        }\r\n\r\n\r\n        render();\r\n\r\n      },\r\n      {\r\n        passive: true\r\n      }\r\n    );\r\n\r\n\r\n    slider.addEventListener(\r\n      \"touchend\",\r\n      function () {\r\n\r\n        dragging = false;\r\n\r\n        paused = false;\r\n\r\n        slider.classList.remove(\r\n          \"is-dragging\"\r\n        );\r\n\r\n      },\r\n      {\r\n        passive: true\r\n      }\r\n    );\r\n\r\n\r\n    slider.addEventListener(\r\n      \"touchcancel\",\r\n      function () {\r\n\r\n        dragging = false;\r\n\r\n        paused = false;\r\n\r\n        slider.classList.remove(\r\n          \"is-dragging\"\r\n        );\r\n\r\n      },\r\n      {\r\n        passive: true\r\n      }\r\n    );\r\n\r\n\r\n    \/* -----------------------------------------\r\n       HOVER\r\n    ----------------------------------------- *\/\r\n\r\n    slider.addEventListener(\r\n      \"mouseenter\",\r\n      function () {\r\n\r\n        if (!dragging) {\r\n          paused = true;\r\n        }\r\n\r\n      }\r\n    );\r\n\r\n\r\n    slider.addEventListener(\r\n      \"mouseleave\",\r\n      function () {\r\n\r\n        if (!dragging) {\r\n          paused = false;\r\n        }\r\n\r\n      }\r\n    );\r\n\r\n\r\n    \/* -----------------------------------------\r\n       START\r\n    ----------------------------------------- *\/\r\n\r\n    animate();\r\n\r\n  });\r\n\r\n\r\n\r\n  \/* =========================================\r\n     PICK UP SLIDER\r\n     LOOK 01 \/ LOOK 02 \u5171\u901a\r\n  ========================================= *\/\r\n\r\n  document.querySelectorAll(\".magazine-pickup\").forEach(function (section) {\r\n\r\n    const slider =\r\n      section.querySelector(\".pickup-slider\");\r\n\r\n    const track =\r\n      section.querySelector(\".pickup-track\");\r\n\r\n    const slides =\r\n      section.querySelectorAll(\".pickup-slide\");\r\n\r\n    const prev =\r\n      section.querySelector(\".pickup-prev\");\r\n\r\n    const next =\r\n      section.querySelector(\".pickup-next\");\r\n\r\n    const dots =\r\n      section.querySelectorAll(\".pickup-dot\");\r\n\r\n\r\n    if (\r\n      !slider ||\r\n      !track ||\r\n      !slides.length\r\n    ) {\r\n      return;\r\n    }\r\n\r\n\r\n    let current = 0;\r\n\r\n    let startX = 0;\r\n\r\n    let distance = 0;\r\n\r\n    let dragging = false;\r\n\r\n\r\n    function moveTo(index) {\r\n\r\n      current =\r\n        (index + slides.length)\r\n        % slides.length;\r\n\r\n\r\n      track.style.transform =\r\n        \"translate3d(-\" +\r\n        (current * 100) +\r\n        \"%,0,0)\";\r\n\r\n\r\n      dots.forEach(function (dot, i) {\r\n\r\n        dot.classList.toggle(\r\n          \"is-active\",\r\n          i === current\r\n        );\r\n\r\n      });\r\n\r\n    }\r\n\r\n\r\n    \/* PREV *\/\r\n\r\n    if (prev) {\r\n\r\n      prev.addEventListener(\r\n        \"click\",\r\n        function () {\r\n\r\n          moveTo(\r\n            current - 1\r\n          );\r\n\r\n        }\r\n      );\r\n\r\n    }\r\n\r\n\r\n    \/* NEXT *\/\r\n\r\n    if (next) {\r\n\r\n      next.addEventListener(\r\n        \"click\",\r\n        function () {\r\n\r\n          moveTo(\r\n            current + 1\r\n          );\r\n\r\n        }\r\n      );\r\n\r\n    }\r\n\r\n\r\n    \/* DOTS *\/\r\n\r\n    dots.forEach(function (dot, index) {\r\n\r\n      dot.addEventListener(\r\n        \"click\",\r\n        function () {\r\n\r\n          moveTo(index);\r\n\r\n        }\r\n      );\r\n\r\n    });\r\n\r\n\r\n    \/* TOUCH *\/\r\n\r\n    slider.addEventListener(\r\n      \"touchstart\",\r\n      function (e) {\r\n\r\n        dragging = true;\r\n\r\n        startX =\r\n          e.touches[0].clientX;\r\n\r\n        distance = 0;\r\n\r\n      },\r\n      {\r\n        passive: true\r\n      }\r\n    );\r\n\r\n\r\n    slider.addEventListener(\r\n      \"touchmove\",\r\n      function (e) {\r\n\r\n        if (!dragging) return;\r\n\r\n\r\n        distance =\r\n          e.touches[0].clientX -\r\n          startX;\r\n\r\n      },\r\n      {\r\n        passive: true\r\n      }\r\n    );\r\n\r\n\r\n    slider.addEventListener(\r\n      \"touchend\",\r\n      function () {\r\n\r\n        if (!dragging) return;\r\n\r\n\r\n        dragging = false;\r\n\r\n\r\n        if (Math.abs(distance) > 50) {\r\n\r\n          if (distance < 0) {\r\n\r\n            moveTo(\r\n              current + 1\r\n            );\r\n\r\n          } else {\r\n\r\n            moveTo(\r\n              current - 1\r\n            );\r\n\r\n          }\r\n\r\n        }\r\n\r\n\r\n        distance = 0;\r\n\r\n      }\r\n    );\r\n\r\n\r\n    \/* MOUSE *\/\r\n\r\n    let mouseDragging = false;\r\n\r\n    let mouseStartX = 0;\r\n\r\n\r\n    slider.addEventListener(\r\n      \"mousedown\",\r\n      function (e) {\r\n\r\n        mouseDragging = true;\r\n\r\n        mouseStartX =\r\n          e.clientX;\r\n\r\n        distance = 0;\r\n\r\n        slider.classList.add(\r\n          \"is-dragging\"\r\n        );\r\n\r\n        e.preventDefault();\r\n\r\n      }\r\n    );\r\n\r\n\r\n    window.addEventListener(\r\n      \"mousemove\",\r\n      function (e) {\r\n\r\n        if (!mouseDragging) return;\r\n\r\n\r\n        distance =\r\n          e.clientX -\r\n          mouseStartX;\r\n\r\n      }\r\n    );\r\n\r\n\r\n    window.addEventListener(\r\n      \"mouseup\",\r\n      function () {\r\n\r\n        if (!mouseDragging) return;\r\n\r\n\r\n        mouseDragging = false;\r\n\r\n        slider.classList.remove(\r\n          \"is-dragging\"\r\n        );\r\n\r\n\r\n        if (Math.abs(distance) > 50) {\r\n\r\n          if (distance < 0) {\r\n\r\n            moveTo(\r\n              current + 1\r\n            );\r\n\r\n          } else {\r\n\r\n            moveTo(\r\n              current - 1\r\n            );\r\n\r\n          }\r\n\r\n        }\r\n\r\n\r\n        distance = 0;\r\n\r\n      }\r\n    );\r\n\r\n\r\n    moveTo(0);\r\n\r\n  });\r\n\r\n});\r\n<\/script>\r\n","protected":false},"excerpt":{"rendered":"FEATURED IN FUDGE OCTOBER 2026 FROM THE MAGAZINE \u96d1\u8a8c\u300eFUDGE\u300f\u306b\u63b2\u8f09\u3055\u308c\u305f\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u304b\u3089\u3001 \u4f7f\u7528\u30a2\u30a4\u30c6\u30e0\u3092\u30d4\u30c3\u30af\u30a2\u30c3\u30d7\u3002 LOOK 01 MAGAZINE STYL [&hellip;]","protected":false},"author":1,"featured_media":11278,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11,9],"tags":[],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-content\/uploads\/2026\/10\/FUDGE_2.png","_links":{"self":[{"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/posts\/11231"}],"collection":[{"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/comments?post=11231"}],"version-history":[{"count":20,"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/posts\/11231\/revisions"}],"predecessor-version":[{"id":11273,"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/posts\/11231\/revisions\/11273"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/media\/11278"}],"wp:attachment":[{"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/media?parent=11231"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/categories?post=11231"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.grandmama-and-kato.com\/blog\/wp-json\/wp\/v2\/tags?post=11231"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}