{"id":221,"date":"2026-01-25T23:20:40","date_gmt":"2026-01-25T14:20:40","guid":{"rendered":"https:\/\/www.shippomemories.com\/?page_id=221"},"modified":"2026-03-22T10:11:57","modified_gmt":"2026-03-22T01:11:57","slug":"221-2","status":"publish","type":"page","link":"https:\/\/www.shippomemories.com\/","title":{"rendered":"\u3057\u3063\u307d\u30e1\u30e2\u30ea\u30fc\u30ba"},"content":{"rendered":"\n<section class=\"wp-block-jinr-blocks-fullwidth b--jinr-block b--jinr-fullwidth-container\"><section class=\"b--jinr-fullwidth\" style=\"background-color:#f5f5f5\"><div class=\"d--fullwidth-max d--fullwidth-pad0 d--fullwidth-pad0-sp t--main-width\" style=\"color:false\">\n<style>\n    \/* =========================================\n       1. \u5f37\u529b\u306a\u30d8\u30c3\u30c0\u30fc\u30fb\u30d5\u30c3\u30bf\u30fc\u524a\u9664\u8a2d\u5b9a\uff08ver2.5\u30d9\u30fc\u30b9\uff09\n       ========================================= *\/\n    \n    \/* \u91cd\u8981\uff1aLP\u306e\u30d8\u30c3\u30c0\u30fc(#shippo-header) \u4ee5\u5916 \u306e\u3059\u3079\u3066\u306e header \u30bf\u30b0\u3092\u975e\u8868\u793a\u306b\u3059\u308b *\/\n    header:not(#shippo-header) {\n        display: none !important;\n    }\n\n    \/* LP\u306e\u30d5\u30c3\u30bf\u30fc\u306fdiv\u30bf\u30b0(.shippo-footer)\u3067\u4f5c\u3063\u3066\u3044\u308b\u305f\u3081\u3001\n       \u7d14\u6b63\u306e footer \u30bf\u30b0\u306f\u3059\u3079\u3066\u975e\u8868\u793a\u306b\u3059\u308b\n    *\/\n    footer {\n        display: none !important;\n    }\n\n    \/* JIN:R \/ JIN \u306e\u7279\u5b9a\u306e\u8981\u7d20\u3092ID\u30fb\u30af\u30e9\u30b9\u6307\u5b9a\u3067\u72d9\u3044\u6483\u3061\u3057\u3066\u975e\u8868\u793a *\/\n    #header-box, #footer-box,\n    .jin-header, .jin-footer,\n    .jinr-header, .jinr-footer,\n    .jinr-site-header, .jinr-site-footer,\n    .jin-breadcrumb, #breadcrumb, .breadcrumb-list,\n    .post-meta, .post-share, .sns-share-area,\n    .jin-profile, .related-area, #page-top,\n    .jin-footer-widget, .jin-copyright,\n    .jinr-page-title-area,\n    .jinr-bread-crumb\n    {\n        display: none !important;\n    }\n\n    \/* --- \u30ec\u30a4\u30a2\u30a6\u30c8\u306e\u5f37\u5236\u30ea\u30bb\u30c3\u30c8 --- *\/\n\n    \/* \u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u5f37\u5236\u7684\u306b\u753b\u9762\u4e00\u676f\u306b\u3059\u308b *\/\n    body .main-container,\n    body .inner,\n    body #main-contents,\n    body .content,\n    body .jin-main-area,\n    body .jin-article,\n    body .entry-content,\n    body .jinr-page,\n    body .jinr-body {\n        width: 100% !important;\n        max-width: 100% !important;\n        padding: 0 !important;\n        margin: 0 !important;\n        background: transparent !important;\n        border: none !important;\n        box-shadow: none !important;\n    }\n\n    \/* \u30da\u30fc\u30b8\u306e\u80cc\u666f\u8272 *\/\n    body {\n        background-color: #fdfbf7 !important;\n        margin: 0 !important;\n    }\n\n    \/* JIN:R\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u30b9\u30bf\u30a4\u30eb\u5e72\u6e09\u3092\u9632\u3050 *\/\n    .shippo-lp-wrapper * {\n        box-sizing: border-box;\n    }\n\n\n    \/* =========================================\n       2. LP\u7528\u30c7\u30b6\u30a4\u30f3\n       ========================================= *\/\n    \n    \/* --- LP\u5168\u4f53\u30e9\u30c3\u30d1\u30fc --- *\/\n    .shippo-lp-wrapper {\n        --c-bg: #fdfbf7;\n        --c-text-main: #5d4037;\n        --c-text-light: #8d6e63;\n        --c-accent: #e67e22;\n        --c-accent-hover: #d35400;\n        --c-white: #ffffff;\n        --c-bg-sub: #f5f0e6;\n        --c-highlight: #fff3e0;\n        --c-line: #06c755;\n        \n        --font-serif: 'Shippori Mincho', serif;\n        --font-sans: 'Zen Maru Gothic', sans-serif;\n        --ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);\n\n        font-family: var(--font-sans);\n        background-color: var(--c-bg);\n        color: var(--c-text-main);\n        line-height: 1.8;\n        overflow-x: hidden;\n        font-feature-settings: \"palt\";\n        text-align: left;\n        width: 100%;\n        position: relative;\n        font-size: 16px;\n    }\n\n    .shippo-lp-wrapper h1, \n    .shippo-lp-wrapper h2, \n    .shippo-lp-wrapper h3, \n    .shippo-lp-wrapper h4 {\n        font-family: var(--font-serif);\n        font-weight: 700;\n        line-height: 1.4;\n        margin: 0;\n    }\n\n    .shippo-lp-wrapper img, \n    .shippo-lp-wrapper video {\n        max-width: 100%;\n        height: auto;\n        display: block;\n    }\n\n    .shippo-lp-wrapper a {\n        text-decoration: none;\n        color: inherit;\n        transition: all 0.3s ease;\n    }\n\n    \/* \u30b3\u30f3\u30c6\u30ca *\/\n    .shippo-lp-wrapper .container {\n        max-width: 1100px;\n        margin: 0 auto;\n        padding: 0 20px;\n        position: relative;\n        z-index: 2;\n    }\n\n    \/* \u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3 *\/\n    .shippo-lp-wrapper .fade-in-up {\n        opacity: 0;\n        transform: translateY(30px);\n        transition: opacity 1s var(--ease-out-expo), transform 1s var(--ease-out-expo);\n    }\n    .shippo-lp-wrapper .fade-in-up.is-visible {\n        opacity: 1;\n        transform: translateY(0);\n    }\n\n    \/* \u30e6\u30fc\u30c6\u30a3\u30ea\u30c6\u30a3 *\/\n    .shippo-lp-wrapper .text-center { text-align: center; }\n\n    \/* \u30dc\u30bf\u30f3 *\/\n    .shippo-lp-wrapper .btn {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        padding: 18px 40px;\n        border-radius: 50px;\n        font-weight: 700;\n        font-size: 1.15rem;\n        letter-spacing: 0.05em;\n        cursor: pointer;\n        box-shadow: 0 10px 20px rgba(230, 126, 34, 0.2);\n        position: relative;\n        overflow: hidden;\n        z-index: 1;\n        border: none;\n    }\n\n    .shippo-lp-wrapper .btn::before {\n        content: '';\n        position: absolute;\n        top: 0; left: 0; width: 0%; height: 100%;\n        background: rgba(255, 255, 255, 0.2);\n        transition: width 0.4s var(--ease-out-expo);\n        z-index: -1;\n    }\n    .shippo-lp-wrapper .btn:hover::before { width: 100%; }\n    .shippo-lp-wrapper .btn:hover {\n        transform: translateY(-2px);\n        box-shadow: 0 15px 30px rgba(230, 126, 34, 0.3);\n    }\n\n    .shippo-lp-wrapper .btn-primary { background: linear-gradient(135deg, #ffa726, #fb8c00); color: var(--c-white); }\n    .shippo-lp-wrapper .btn-line { background-color: var(--c-line); color: white; box-shadow: 0 10px 20px rgba(6, 199, 85, 0.2); }\n    .shippo-lp-wrapper .btn-instagram { background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); color: white; box-shadow: 0 10px 20px rgba(220, 39, 67, 0.2); }\n    .shippo-lp-wrapper .btn-submit { background: var(--c-text-main); color: white; width: 100%; box-shadow: 0 10px 20px rgba(93, 64, 55, 0.2); }\n    .shippo-lp-wrapper .btn-submit:hover { background: #4e342e; box-shadow: 0 15px 30px rgba(93, 64, 55, 0.3); }\n\n    \/* \u30bb\u30af\u30b7\u30e7\u30f3 *\/\n    .shippo-lp-wrapper section { padding: 80px 0; position: relative; }\n\n    .shippo-lp-wrapper .section-title {\n        font-size: clamp(2.2rem, 6vw, 3.2rem);\n        margin-bottom: 30px;\n        position: relative;\n        display: inline-block;\n        line-height: 1.3;\n    }\n    .shippo-lp-wrapper .section-title::after {\n        content: ''; display: block; width: 60px; height: 5px;\n        background: var(--c-accent); margin: 20px auto 0; border-radius: 3px;\n    }\n\n    .shippo-lp-wrapper .section-subtitle {\n        font-size: 1.1rem;\n        color: var(--c-text-light);\n        margin-bottom: 30px; letter-spacing: 0.05em; display: block;\n        font-weight: bold;\n    }\n\n    \/* LP\u7528\u30d8\u30c3\u30c0\u30fc *\/\n    .shippo-lp-wrapper #shippo-header {\n        position: fixed; top: 0; left: 0; width: 100%; padding: 15px 20px;\n        display: flex !important;\n        justify-content: space-between; align-items: center;\n        z-index: 9999; transition: all 0.3s ease;\n        background: transparent;\n    }\n    .shippo-lp-wrapper #shippo-header.scrolled {\n        background: rgba(255, 255, 255, 0.95);\n        backdrop-filter: blur(10px);\n        box-shadow: 0 4px 20px rgba(0,0,0,0.05);\n    }\n    .shippo-lp-wrapper .logo {\n        font-family: var(--font-serif); font-size: 1.3rem;\n        font-weight: 700; color: var(--c-text-main);\n        display: flex; align-items: center; gap: 8px;\n    }\n    .shippo-lp-wrapper .logo i { color: var(--c-accent); }\n\n    \/* Hero *\/\n    .shippo-lp-wrapper .hero {\n        min-height: 100vh; padding-top: 100px; padding-bottom: 60px;\n        display: flex; align-items: center; justify-content: center;\n        position: relative; overflow: hidden; background-color: #fdfbf7;\n    }\n    .shippo-lp-wrapper .hero-bg-shape {\n        position: absolute; border-radius: 50%; filter: blur(80px);\n        opacity: 0.6; animation: shippoFloat 20s infinite ease-in-out; z-index: 0;\n    }\n    .shippo-lp-wrapper .shape-1 { width: 60vw; height: 60vw; background: #ffe0b2; top: -20%; right: -20%; }\n    .shippo-lp-wrapper .shape-2 { width: 50vw; height: 50vw; background: #ffccbc; bottom: -10%; left: -15%; animation-delay: -5s; }\n\n    @keyframes shippoFloat {\n        0%, 100% { transform: translate(0, 0) scale(1); }\n        50% { transform: translate(20px, -20px) scale(1.05); }\n    }\n\n    .shippo-lp-wrapper .hero-container {\n        display: flex; flex-direction: column; align-items: center;\n        text-align: center; width: 100%; padding: 20px 0;\n        position: relative; z-index: 10;\n    }\n\n    .shippo-lp-wrapper .hero-brand-name {\n        font-family: var(--font-serif); font-size: 2.4rem; color: var(--c-accent);\n        margin-bottom: 10px; font-weight: 700; letter-spacing: 0.05em;\n        display: inline-block;\n    }\n    .shippo-lp-wrapper .hero-tagline {\n        font-size: 1rem; color: var(--c-text-main); letter-spacing: 0.1em;\n        margin-bottom: 20px; font-weight: 700; display: block;\n    }\n    .shippo-lp-wrapper .hero-title {\n        font-size: clamp(2.4rem, 9vw, 4.5rem); margin-bottom: 30px;\n        line-height: 1.25; font-feature-settings: \"palt\";\n    }\n    .shippo-lp-wrapper .hero-title span {\n        display: block; font-size: 0.5em; margin-top: 15px;\n        font-weight: 400; color: var(--c-text-light); letter-spacing: 0.05em;\n    }\n\n    .shippo-lp-wrapper .hero-visual-area { width: 100%; margin-bottom: 40px; }\n\n    .shippo-lp-wrapper .hero-image-wrapper {\n        width: 90vw; max-width: 500px; margin: 0 auto;\n        border-radius: 40% 60% 70% 30% \/ 40% 50% 60% 50%;\n        overflow: hidden;\n        box-shadow: 15px 15px 50px rgba(189, 155, 126, 0.2);\n        animation: shippoMorph 10s ease-in-out infinite;\n        aspect-ratio: 1\/1; background-color: #ffe0b2;\n    }\n\n    @keyframes shippoMorph {\n        0% { border-radius: 40% 60% 70% 30% \/ 40% 50% 60% 50%; }\n        50% { border-radius: 60% 40% 30% 70% \/ 60% 30% 70% 40%; }\n        100% { border-radius: 40% 60% 70% 30% \/ 40% 50% 60% 50%; }\n    }\n\n    .shippo-lp-wrapper .hero-image-wrapper img { width: 100%; height: 100%; object-fit: cover; }\n\n    .shippo-lp-wrapper .hero-desc {\n        font-size: 1.1rem; \/* \u672c\u6587\u62e1\u5927 *\/\n        line-height: 1.9; margin-bottom: 40px;\n        color: var(--c-text-main); text-align: left;\n        max-width: 500px; padding: 0 10px;\n    }\n\n    \/* Problem *\/\n    .shippo-lp-wrapper .problem-grid { display: flex; flex-direction: column; gap: 40px; }\n    .shippo-lp-wrapper .problem-image img { border-radius: 15px; box-shadow: 15px 15px 0px var(--c-bg-sub); }\n    .shippo-lp-wrapper .problem-text h2 {\n        font-size: clamp(2.0rem, 6vw, 2.8rem); margin-bottom: 30px;\n        color: #d35400; line-height: 1.4;\n    }\n    .shippo-lp-wrapper .problem-text p { font-size: 1.1rem; }\n\n    \/* Agitation *\/\n    .shippo-lp-wrapper .agitation { background-color: #fff8e1; padding: 100px 0; }\n    .shippo-lp-wrapper .agitation-grid { display: flex; flex-direction: column; gap: 50px; align-items: center; }\n    .shippo-lp-wrapper .agitation-image {\n        width: 100%; max-width: 500px; border-radius: 20px;\n        overflow: hidden; box-shadow: 0 20px 40px rgba(230, 126, 34, 0.15);\n    }\n    .shippo-lp-wrapper .agitation-image img {\n        width: 100%; height: auto; display: block; transition: transform 0.5s ease;\n    }\n    .shippo-lp-wrapper .agitation-image:hover img { transform: scale(1.03); }\n    .shippo-lp-wrapper .story-box {\n        background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px);\n        padding: 40px 30px; border-radius: 20px; text-align: left;\n        box-shadow: 0 15px 35px rgba(0,0,0,0.05);\n    }\n    .shippo-lp-wrapper .story-box p { font-size: 1.1rem; }\n    .shippo-lp-wrapper .story-box .section-title,\n    .shippo-lp-wrapper .story-box .section-title::after {\n        margin-left: 0; margin-right: auto; text-align: left;\n    }\n\n    \/* Comparison *\/\n    .shippo-lp-wrapper .comparison { background-color: var(--c-bg-sub); }\n\n    .shippo-lp-wrapper .comparison-tabs {\n        display: flex; justify-content: center; gap: 15px; margin-bottom: 30px;\n    }\n    .shippo-lp-wrapper .tab-btn {\n        background: transparent; border: 2px solid var(--c-accent);\n        color: var(--c-accent); padding: 12px 30px; border-radius: 30px;\n        font-weight: 700; cursor: pointer; transition: all 0.3s;\n        font-size: 1.05rem;\n    }\n    .shippo-lp-wrapper .tab-btn.active, \n    .shippo-lp-wrapper .tab-btn:hover { background: var(--c-accent); color: white; }\n\n    .shippo-lp-wrapper .comparison-content { display: none; opacity: 0; transition: opacity 0.5s ease; }\n    .shippo-lp-wrapper .comparison-content.active { display: block; opacity: 1; }\n\n    .shippo-lp-wrapper .comparison-viewer {\n        position: relative; width: 100%; max-width: 800px; aspect-ratio: 4\/3;\n        margin: 0 auto 15px; border-radius: 15px; overflow: hidden;\n        box-shadow: 0 15px 40px rgba(0,0,0,0.15); background-color: #ddd;\n        user-select: none;\n        touch-action: none;\n    }\n    .shippo-lp-wrapper #slider-video { cursor: pointer; }\n    .shippo-lp-wrapper #slider-video:active { cursor: grabbing; }\n\n    .shippo-lp-wrapper .comparison-viewer img, \n    .shippo-lp-wrapper .comparison-viewer video {\n        width: 100%; height: 100%; object-fit: cover;\n        position: absolute; top: 0; left: 0; display: block;\n    }\n\n    .shippo-lp-wrapper .img-modified {\n        z-index: 2; background-size: cover; background-position: center;\n        background-repeat: no-repeat; clip-path: inset(0 50% 0 0);\n    }\n    .shippo-lp-wrapper .img-after-layer { z-index: 1; }\n    .shippo-lp-wrapper .img-before-layer { z-index: 2; clip-path: inset(0 50% 0 0); }\n\n    \/* Video Layers *\/\n    .shippo-lp-wrapper .video-layer {\n        position: absolute;\n        top: 0; left: 0; width: 100%; height: 100%;\n        transition: opacity 0.15s ease-out; \/* Smooth transition *\/\n    }\n    .shippo-lp-wrapper .video-before { z-index: 2; opacity: 1; }\n    .shippo-lp-wrapper .video-after { z-index: 1; opacity: 1; }\n    .shippo-lp-wrapper .comparison-viewer.is-holding .video-before { opacity: 0; }\n    \n    \/* REMOVED .hold-indicator *\/\n    .shippo-lp-wrapper .hold-indicator { display: none; }\n\n    .shippo-lp-wrapper .slider-handle {\n        position: absolute; top: 0; bottom: 0; left: 50%;\n        width: 4px; background: var(--c-white); z-index: 10;\n        pointer-events: none; box-shadow: 0 0 5px rgba(0,0,0,0.2);\n    }\n    .shippo-lp-wrapper .slider-circle {\n        position: absolute; top: 50%; left: 50%;\n        transform: translate(-50%, -50%); width: 44px; height: 44px;\n        background: var(--c-accent); color: white; border-radius: 50%;\n        display: flex; align-items: center; justify-content: center;\n        border: 4px solid white; box-shadow: 0 0 10px rgba(0,0,0,0.2);\n    }\n\n    \/* Topaz-style Status Badge *\/\n    .shippo-lp-wrapper .status-label {\n        position: absolute;\n        bottom: 20px; left: 20px; \/* Modified to bottom-left *\/\n        background: rgba(0, 0, 0, 0.6);\n        color: #fff;\n        padding: 6px 12px;\n        border-radius: 6px;\n        font-size: 0.85rem;\n        font-weight: 600;\n        z-index: 10;\n        pointer-events: none;\n        letter-spacing: 0.05em;\n        backdrop-filter: blur(4px);\n        border: 1px solid rgba(255, 255, 255, 0.2);\n    }\n\n    .shippo-lp-wrapper .comparison-labels {\n        display: flex; justify-content: space-between;\n        max-width: 800px; margin: 15px auto;\n        font-weight: bold; color: var(--c-text-light); font-size: 1rem;\n    }\n\n    \/* Solution *\/\n    .shippo-lp-wrapper .service-cards {\n        display: flex; flex-direction: column; gap: 30px;\n    }\n    .shippo-lp-wrapper .card {\n        background: white; padding: 40px 30px; border-radius: 20px;\n        border: 3px solid #ffe0b2; box-shadow: 0 10px 25px rgba(0,0,0,0.05);\n        transition: transform 0.3s ease;\n    }\n    .shippo-lp-wrapper .card:hover { transform: translateY(-5px); }\n    .shippo-lp-wrapper .card-icon { font-size: 3rem; color: var(--c-accent); margin-bottom: 25px; }\n    .shippo-lp-wrapper .card h3 { \n        font-size: 1.5rem; margin-bottom: 20px; \n        display: inline-block;\n        border-bottom: 2px dashed var(--c-accent); padding-bottom: 5px;\n    }\n    .shippo-lp-wrapper .card ul { list-style: none; padding: 0; font-size: 1.05rem; }\n    .shippo-lp-wrapper .card li { margin-bottom: 12px; padding-left: 24px; position: relative; }\n    .shippo-lp-wrapper .card li::before {\n        content: '\\f00c'; font-family: 'Font Awesome 6 Free'; font-weight: 900;\n        color: var(--c-accent); position: absolute; left: 0; font-size: 1rem;\n    }\n\n    \/* Price *\/\n    .shippo-lp-wrapper .price-section { background-color: var(--c-bg-sub); }\n    .shippo-lp-wrapper .price-grid { display: flex; flex-direction: column; gap: 40px; margin-top: 30px; }\n    .shippo-lp-wrapper .price-card { background: white; border-radius: 20px; padding: 40px 20px; text-align: center; }\n    .shippo-lp-wrapper .price-card.recommended { border: 3px solid var(--c-accent); position: relative; }\n    .shippo-lp-wrapper .badge {\n        position: absolute; top: -18px; left: 50%; transform: translateX(-50%);\n        background: var(--c-accent); color: white;\n        padding: 8px 20px; border-radius: 10px; font-weight: bold; font-size: 0.95rem;\n    }\n    .shippo-lp-wrapper .price-amount {\n        font-size: 2.2rem; font-weight: 700; color: var(--c-accent); margin: 20px 0; font-family: var(--font-serif);\n    }\n    .shippo-lp-wrapper .price-amount span { font-size: 1rem; color: var(--c-text-light); font-weight: normal; }\n    \n    .shippo-lp-wrapper .price-menu {\n        list-style: none; padding: 0; text-align: left;\n        font-size: 1.05rem; margin: 20px auto 30px;\n        max-width: 400px; width: 100%;\n    }\n    .shippo-lp-wrapper .price-menu li {\n        padding: 12px 0; border-bottom: 1px dashed #eee;\n        display: flex; justify-content: space-between; align-items: baseline;\n    }\n    .shippo-lp-wrapper .price-menu li:last-child { border-bottom: none; }\n    .shippo-lp-wrapper .price-menu .label { color: var(--c-text-main); font-weight: 500; }\n    .shippo-lp-wrapper .price-menu .value { color: var(--c-accent); font-weight: 700; font-family: var(--font-serif); white-space: nowrap; }\n    .shippo-lp-wrapper .price-menu small { font-size: 0.85rem; color: #888; display: block; margin-top: 4px; }\n    .shippo-lp-wrapper .price-menu li.option { flex-direction: column; align-items: flex-start; gap: 5px; }\n    .shippo-lp-wrapper .price-menu li.option .value { align-self: flex-end; }\n    .shippo-lp-wrapper .price-note {\n        font-size: 0.85rem; color: var(--c-text-light); margin-top: 30px; text-align: right;\n        position: relative; z-index: 1;\n    }\n\n    \/* FAQ (New) *\/\n    .shippo-lp-wrapper .faq-list {\n        max-width: 800px; margin: 0 auto;\n        display: flex; flex-direction: column; gap: 20px;\n    }\n    .shippo-lp-wrapper .faq-item {\n        background: white; border-radius: 15px;\n        box-shadow: 0 5px 15px rgba(0,0,0,0.05); overflow: hidden;\n        border: 1px solid #f0f0f0;\n    }\n    .shippo-lp-wrapper .faq-summary {\n        padding: 20px 25px; font-weight: 700; cursor: pointer;\n        position: relative; list-style: none; color: var(--c-text-main);\n        display: flex; align-items: center; justify-content: space-between;\n        font-size: 1.05rem;\n    }\n    .shippo-lp-wrapper .faq-summary::-webkit-details-marker { display: none; }\n    .shippo-lp-wrapper .faq-summary::after {\n        content: '\\f078'; font-family: 'Font Awesome 6 Free'; font-weight: 900;\n        color: var(--c-accent); transition: transform 0.3s;\n    }\n    .shippo-lp-wrapper .faq-item[open] .faq-summary::after { transform: rotate(180deg); }\n    .shippo-lp-wrapper .faq-answer {\n        padding: 0 25px 25px; color: var(--c-text-main);\n        font-size: 1rem; line-height: 1.8;\n        border-top: 1px solid #f0f0f0; margin-top: 0; padding-top: 20px;\n    }\n    .shippo-lp-wrapper .faq-q-mark {\n        color: var(--c-accent); margin-right: 15px; font-size: 1.3rem; font-family: var(--font-serif);\n    }\n\n    \/* Contact *\/\n    .shippo-lp-wrapper .cta-section { background: linear-gradient(135deg, #fff8e1 0%, #fff 100%); }\n    .shippo-lp-wrapper .cta-box {\n        background: white; border-radius: 30px; padding: 40px 20px;\n        box-shadow: 0 20px 40px rgba(230,126,34,0.1);\n    }\n    .shippo-lp-wrapper .contact-grid { display: flex; flex-direction: column; gap: 40px; }\n    .shippo-lp-wrapper .contact-left { text-align: left; }\n    .shippo-lp-wrapper .contact-lead { font-size: 1.1rem; margin-bottom: 30px; line-height: 1.9; }\n\n    .shippo-lp-wrapper .line-promo-box {\n        background: #f0fdf4; padding: 30px 20px; border-radius: 20px;\n        border: 2px solid #bbf7d0; text-align: center;\n    }\n    .shippo-lp-wrapper .line-promo-label {\n        display: inline-block; color: #15803d; font-weight: bold;\n        font-size: 1.2rem; margin-bottom: 20px;\n    }\n    .shippo-lp-wrapper .line-promo-text { font-size: 1rem; margin-bottom: 25px; color: #166534; }\n    .shippo-lp-wrapper .cta-buttons { display: flex; flex-direction: column; align-items: center; width: 100%; }\n\n    .shippo-lp-wrapper .btn-line-large {\n        background-color: var(--c-line); color: white;\n        font-size: 1.3rem; font-weight: 700; padding: 20px 30px;\n        width: 100%; max-width: 400px;\n        display: flex; align-items: center; justify-content: center;\n        border-radius: 50px;\n        box-shadow: 0 10px 20px rgba(6, 199, 85, 0.3);\n        border: 2px solid white; transition: all 0.3s;\n    }\n    .shippo-lp-wrapper .btn-line-large:hover {\n        background-color: #05b34c;\n        box-shadow: 0 15px 30px rgba(6, 199, 85, 0.4);\n        transform: translateY(-3px);\n    }\n\n    .shippo-lp-wrapper .contact-form-wrapper { background: var(--c-bg); padding: 30px; border-radius: 20px; }\n    .shippo-lp-wrapper .form-title {\n        font-size: 1.1rem; font-weight: bold; margin-bottom: 25px;\n        text-align: center; border-bottom: 2px solid #eee;\n        padding-bottom: 15px; color: var(--c-text-light);\n    }\n    .shippo-lp-wrapper .form-group { margin-bottom: 20px; }\n    .shippo-lp-wrapper .form-label { display: block; font-size: 0.95rem; font-weight: 700; margin-bottom: 8px; }\n    .shippo-lp-wrapper .form-tag { background: #ffe0b2; font-size: 0.75rem; padding: 2px 8px; border-radius: 3px; color: #e65100; margin-left: 5px; }\n    .shippo-lp-wrapper .form-input, \n    .shippo-lp-wrapper .form-textarea {\n        width: 100%; padding: 15px; border-radius: 10px;\n        border: 1.5px solid #eee; font-family: inherit; font-size: 1.05rem; \/* \u5165\u529b\u6587\u5b57\u30b5\u30a4\u30ba\u3082\u62e1\u5927 *\/\n    }\n    .shippo-lp-wrapper .form-textarea { min-height: 120px; }\n    .shippo-lp-wrapper .btn-submit { background: var(--c-text-main); color: white; width: 100%; font-size: 1.2rem; padding: 18px 40px;}\n\n    \/* \u6ce8\u91c8 - \u8996\u8a8d\u6027\u5411\u4e0a\u7248 *\/\n    .shippo-lp-wrapper .form-note {\n        font-size: 1rem; \/* \u5927\u304d\u304f *\/\n        color: #333; \/* \u9ed2\u304f *\/\n        font-weight: 700; \/* \u592a\u5b57 *\/\n        text-align: center; \n        margin-top: 20px; \n        display: block;\n        background-color: #fff3e0; \/* \u80cc\u666f\u8272\u8ffd\u52a0\u3067\u30dc\u30c3\u30af\u30b9\u5316 *\/\n        padding: 15px;\n        border-radius: 8px;\n    }\n\n    .shippo-lp-wrapper .portfolio-note {\n        font-size: 0.8rem; color: #888; margin-top: 30px; text-align: center; line-height: 1.6;\n    }\n\n    \/* Footer (Wrapper\u5185) - div\u3068\u3057\u3066\u5b9a\u7fa9 *\/\n    .shippo-lp-wrapper .shippo-footer {\n        background: #4e342e; color: #d7ccc8; padding: 50px 20px; text-align: center;\n        display: block !important;\n    }\n    .shippo-lp-wrapper .footer-logo {\n        font-size: 1.8rem; color: white; margin-bottom: 20px; display: inline-block; font-family: var(--font-serif);\n    }\n    .shippo-lp-wrapper .footer-sns { margin-bottom: 25px; }\n    .shippo-lp-wrapper .footer-sns a {\n        color: white; font-size: 2.2rem; margin: 0 15px; opacity: 0.8; transition: opacity 0.3s;\n    }\n    .shippo-lp-wrapper .footer-sns a:hover { opacity: 1; }\n    \n    \/* \u30d5\u30c3\u30bf\u30fc\u30ea\u30f3\u30af\u7528\u30b9\u30bf\u30a4\u30eb\u8ffd\u52a0 *\/\n    .shippo-lp-wrapper .footer-links { margin: 20px 0; font-size: 0.9rem; }\n    .shippo-lp-wrapper .footer-links a {\n        color: #d7ccc8; margin: 0 10px; text-decoration: underline; opacity: 0.8;\n        font-weight: bold; \n    }\n    .shippo-lp-wrapper .footer-links a:hover { opacity: 1; color: white; }\n\n    .shippo-lp-wrapper .copyright {\n        font-size: 0.8rem; margin-top: 40px; opacity: 0.5; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 20px;\n    }\n\n    \/* Flow Section (New) *\/\n    .shippo-lp-wrapper .flow-section { background-color: #fff; }\n    .shippo-lp-wrapper .flow-grid { display: flex; flex-direction: column; gap: 30px; margin-top: 40px; }\n    .shippo-lp-wrapper .flow-item { \n        display: flex; gap: 20px; align-items: flex-start; \n        background: var(--c-bg-sub); padding: 25px; border-radius: 15px; \n        position: relative; \n    }\n    .shippo-lp-wrapper .flow-num { \n        background: var(--c-accent); color: white; width: 35px; height: 35px; \n        border-radius: 50%; display: flex; align-items: center; justify-content: center; \n        font-weight: bold; flex-shrink: 0; font-size: 1.2rem; \n    }\n    .shippo-lp-wrapper .flow-content h3 { font-size: 1.2rem; margin-bottom: 5px; }\n    .shippo-lp-wrapper .flow-content p { font-size: 0.95rem; margin: 0; }\n\n    \/* PC\u5411\u3051\u30b9\u30bf\u30a4\u30eb *\/\n    @media (min-width: 769px) {\n        .shippo-lp-wrapper section { padding: 120px 0; }\n        \n        .shippo-lp-wrapper .hero-container {\n            flex-direction: row; text-align: left; justify-content: space-between;\n            max-width: 1200px; padding: 40px 24px;\n        }\n        .shippo-lp-wrapper .hero-text-area { flex: 1; }\n        .shippo-lp-wrapper .hero-visual-area { flex: 1.2; order: 2; margin-bottom: 0; }\n        .shippo-lp-wrapper .hero-image-wrapper { width: 100%; }\n        .shippo-lp-wrapper .hero-desc { text-align: left; }\n        .shippo-lp-wrapper .hero-brand-name { font-size: 3rem; margin-bottom: 15px; }\n        \n        .shippo-lp-wrapper .problem-grid { grid-template-columns: 1fr 1fr; display: grid; }\n        \n        .shippo-lp-wrapper .agitation-grid {\n            flex-direction: row; align-items: center; justify-content: space-between;\n        }\n        .shippo-lp-wrapper .agitation-image { flex: 1; order: 1; max-width: 45%; }\n        .shippo-lp-wrapper .story-box { flex: 1.2; order: 2; padding: 60px; }\n\n        .shippo-lp-wrapper .flow-grid { flex-direction: row; flex-wrap: wrap; justify-content: center; }\n        .shippo-lp-wrapper .flow-item { width: calc(33% - 20px); flex-direction: column; text-align: center; align-items: center; }\n        \n        .shippo-lp-wrapper .service-cards, \n        .shippo-lp-wrapper .price-grid { flex-direction: row; }\n        \n        .shippo-lp-wrapper .price-card.recommended { transform: scale(1.08); margin: 0; }\n        \n        .shippo-lp-wrapper .contact-grid { grid-template-columns: 1fr 1.2fr; display: grid; }\n        .shippo-lp-wrapper .btn-line-large { font-size: 1.4rem; padding: 25px 40px; }\n        .shippo-lp-wrapper .price-note { margin-top: 60px; }\n    }\n<\/style>\n\n<!-- Google Fonts & FontAwesome -->\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Shippori+Mincho:wght@400;500;700&#038;family=Zen+Maru+Gothic:wght@400;500;700&#038;display=swap\" rel=\"stylesheet\">\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\n\n<!-- LP Wrapper Start -->\n<div class=\"shippo-lp-wrapper\">\n\n    <!-- Header -->\n    <header id=\"shippo-header\">\n        <div class=\"logo\"><i class=\"fa-solid fa-paw\"><\/i>\u3057\u3063\u307d\u30e1\u30e2\u30ea\u30fc\u30ba<\/div>\n        <a href=\"#contact\" class=\"btn btn-primary\" style=\"padding: 8px 20px; font-size: 0.85rem;\">\u76f8\u8ac7\u3059\u308b<\/a>\n    <\/header>\n\n    <!-- Hero -->\n    <section class=\"hero\">\n        <div class=\"hero-bg-shape shape-1\"><\/div>\n        <div class=\"hero-bg-shape shape-2\"><\/div>\n        <div class=\"hero-container\">\n            <!-- Image Area -->\n            <div class=\"hero-visual-area fade-in-up\">\n                <div class=\"hero-image-wrapper\">\n                    <!-- \u30d2\u30fc\u30ed\u30fc\u753b\u50cf -->\n                    <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1552053831-71594a27632d?q=80&#038;w=900&#038;auto=format&#038;fit=crop\" alt=\"Hero Dog\">\n                <\/div>\n            <\/div>\n            <!-- Text Area -->\n            <div class=\"hero-text-area\">\n                <p class=\"hero-brand-name fade-in-up\">\u3057\u3063\u307d\u30e1\u30e2\u30ea\u30fc\u30ba<\/p>\n                <span class=\"hero-tagline fade-in-up\">\u30da\u30c3\u30c8\u5199\u771f\u30fb\u52d5\u753b\u306e\u9ad8\u753b\u8cea\u5316\uff0f\u307c\u3051\u30fb\u6697\u3055\u88dc\u6b63\uff0f\u601d\u3044\u51fa\u4fee\u5fa9\u30b5\u30fc\u30d3\u30b9<\/span>\n                <h1 class=\"hero-title fade-in-up\">\u8a18\u61b6\u306e\u8f2a\u90ed\u3092\u3001<br>\u3082\u3046\u4e00\u5ea6\u3002<span>Shippo Memories<\/span><\/h1>\n                <p class=\"hero-desc fade-in-up\">\u3042\u3069\u3051\u306a\u3044\u77b3\u3082\u3001\u3075\u308f\u3075\u308f\u306e\u6bdb\u4e26\u307f\u3082\u3002\u6700\u65b0\u306eAI\u3067\u3001\u5927\u5207\u306a\u30da\u30c3\u30c8\u3068\u306e\u601d\u3044\u51fa\u3092\u304f\u3063\u304d\u308a\u3068\u9bae\u3084\u304b\u306b\u8607\u3089\u305b\u307e\u3059\u3002<\/p>\n                <div class=\"fade-in-up\"><a href=\"#comparison\" class=\"btn btn-primary\">\u5909\u5316\u3092\u4f53\u9a13\u3059\u308b<\/a><\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Problem -->\n    <section class=\"problem container\">\n        <div class=\"problem-grid\">\n            <div class=\"problem-image fade-in-up\">\n                <!-- \u3010\u753b\u50cf\u8a2d\u5b9a\u7b87\u6240\u3011 -->\n                <img decoding=\"async\" src=\"https:\/\/shippomemories.com\/wp-content\/uploads\/2026\/01\/18c2d2bb4121ce4cbffd92c8c3dff4ce.jpg\" alt=\"Old blurry photo\">\n            <\/div>\n            <div class=\"problem-text fade-in-up\">\n                <h2>\u305d\u306e\u300c\u5b9d\u7269\u300d\u3001<br>\u307c\u3084\u3051\u3066\u3044\u307e\u305b\u3093\u304b\uff1f<\/h2>\n                <p>\u6614\u306e\u30b9\u30de\u30db\u3067\u64ae\u3063\u305f\u52d5\u753b\u3084\u3001\u52d5\u304d\u56de\u3063\u3066\u30d4\u30f3\u30dc\u30b1\u3057\u305f\u5199\u771f\u3002\u5927\u597d\u304d\u306a\u3042\u306e\u5b50\u306e\u59ff\u304c\u307c\u3093\u3084\u308a\u3057\u3066\u3044\u308b\u306e\u306f\u3001\u3069\u3053\u304b\u5bc2\u3057\u3044\u3082\u306e\u3067\u3059\u3002<br><br>\u753b\u9762\u304c\u7dba\u9e97\u306b\u306a\u308b\u307b\u3069\u3001\u904e\u53bb\u306e\u753b\u8cea\u306e\u7c97\u3055\u304c\u76ee\u7acb\u3063\u3066\u3057\u307e\u3044\u307e\u3059\u3002<\/p>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Agitation -->\n    <section class=\"agitation\">\n        <div class=\"container\">\n            <div class=\"agitation-grid\">\n                <div class=\"agitation-image fade-in-up\">\n                    <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1518717758536-85ae29035b6d?q=80&#038;w=1000&#038;auto=format&#038;fit=crop\" alt=\"\u5207\u306a\u3052\u306a\u8868\u60c5\u306e\u72ac\">\n                <\/div>\n                <div class=\"story-box fade-in-up\">\n                    <h2 class=\"section-title\">\u4e8c\u5ea6\u3068\u623b\u308c\u306a\u3044\u6642\u9593\u3060\u304b\u3089<\/h2>\n                    <p>\u8a18\u9332\u304c\u8272\u3042\u305b\u3066\u3044\u304f\u306e\u306f\u3001\u601d\u3044\u51fa\u307e\u3067\u9060\u3056\u304b\u308b\u3088\u3046\u3067\u3002\u4eca\u3001\u7dba\u9e97\u306b\u6b8b\u3057\u3066\u304a\u304b\u306a\u3051\u308c\u3070\u300110\u5e74\u5f8c\u3001\u3082\u3063\u3068\u5f8c\u6094\u3059\u308b\u304b\u3082\u3057\u308c\u307e\u305b\u3093\u3002<br><br>\u3042\u306e\u65e5\u3001\u3042\u306a\u305f\u3092\u898b\u3064\u3081\u3066\u3044\u305f\u305d\u306e\u77b3\u306e\u8f1d\u304d\u3092\u3001\u3082\u3046\u4e00\u5ea6\u9bae\u660e\u306b\u53d6\u308a\u623b\u3057\u307e\u305b\u3093\u304b\uff1f<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Comparison (Image & Video) -->\n    <section id=\"comparison\" class=\"comparison\">\n        <div class=\"container text-center\">\n            <span class=\"section-subtitle\">OUR TECHNOLOGY<\/span>\n            <h2 class=\"section-title fade-in-up\">\u9a5a\u304d\u306e\u30ad\u30ec\u30a4\u3055\u3078<\/h2>\n            <p class=\"fade-in-up\">\u9055\u3044\u3092\u4f53\u9a13\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n            <div class=\"comparison-tabs fade-in-up\">\n                <button class=\"tab-btn active\" onclick=\"switchTab('image')\"><i class=\"fa-regular fa-image\"><\/i> \u5199\u771f\u3067\u6bd4\u8f03<\/button>\n                <button class=\"tab-btn\" onclick=\"switchTab('video')\"><i class=\"fa-solid fa-film\"><\/i> \u52d5\u753b\u3067\u6bd4\u8f03<\/button>\n            <\/div>\n\n            <!-- Image Slider -->\n            <div id=\"comp-image\" class=\"comparison-content active fade-in-up\">\n                <p style=\"font-size:0.9rem; margin-bottom:15px; color:#666;\">\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u5de6\u53f3\u306b\u52d5\u304b\u3057\u3066\u304f\u3060\u3055\u3044<\/p>\n                \n                <div class=\"comparison-viewer\" id=\"slider-image\">\n                    <!-- \u2605\u3010\u5909\u66f4\u70b9\u3011After\u753b\u50cf -->\n                    <img decoding=\"async\" src=\"https:\/\/www.shippomemories.com\/wp-content\/uploads\/2026\/01\/after.jpg\" alt=\"After High Quality\" class=\"img-after-layer\">\n                    \n                    <!-- \u2605\u3010\u5909\u66f4\u70b9\u3011Before\u753b\u50cf\uff08\u30d5\u30a3\u30eb\u30bf\u30fc\u306a\u3057\uff09 -->\n                    <!-- \u2605\u3010\u91cd\u8981\u4fee\u6b63\u3011background-image\u3067\u306f\u306a\u304fimg\u30bf\u30b0\u3067\u8868\u793a -->\n                    <img decoding=\"async\" src=\"https:\/\/www.shippomemories.com\/wp-content\/uploads\/2026\/01\/before.jpg\" alt=\"Before Low Quality\" class=\"img-before-layer\">\n                    \n                    <div class=\"slider-handle\"><div class=\"slider-circle\"><i class=\"fa-solid fa-arrows-left-right\"><\/i><\/div><\/div>\n                <\/div>\n                \n                <div class=\"comparison-labels\"><span>\u5143\u306e\u5199\u771f<\/span><span>\u9ad8\u753b\u8cea\u5316<\/span><\/div>\n            <\/div>\n\n            <!-- Video Comparison -->\n            <div id=\"comp-video\" class=\"comparison-content\">\n                <div class=\"comparison-viewer\" id=\"slider-video\">\n                    <div class=\"status-label\" id=\"video-status\">\u5143\u52d5\u753b<\/div>\n                    \n                    <!-- After Video (Background \/ Hidden initially by Before) -->\n                    <div class=\"video-layer video-after\" style=\"opacity: 0;\">\n                        <video id=\"vid-after\" src=\"https:\/\/www.shippomemories.com\/wp-content\/uploads\/2026\/01\/after_movie.mp4\" autoplay loop muted playsinline><\/video>\n                    <\/div>\n                    \n                    <!-- Before Video (Foreground \/ Visible initially) -->\n                    <div class=\"video-layer video-before\" style=\"opacity: 1;\">\n                        <video id=\"vid-before\" src=\"https:\/\/www.shippomemories.com\/wp-content\/uploads\/2026\/01\/before_movie.mp4\" autoplay loop muted playsinline style=\"width: 100%; height: 100%; object-fit: cover;\"><\/video>\n                    <\/div>\n                <\/div>\n                <!-- \u30e6\u30fc\u30b6\u30fc\u6307\u793a\u306b\u3088\u308a\u3001\u9577\u62bc\u3057\u6848\u5185\u306e\u8996\u8a8d\u6027\u5411\u4e0a\uff08\u30c6\u30ad\u30b9\u30c8\u8868\u793a\u306e\u307f\uff09 -->\n                <p style=\"font-size: 0.95rem; margin-top: 15px; color: #5d4037; font-weight: bold; text-align: center;\">\n                    <i class=\"fa-regular fa-hand-pointer\" style=\"margin-right:5px;\"><\/i> \u753b\u9762\u3092\u9577\u62bc\u3057\u3057\u3066\u3044\u308b\u9593\u3001\u9ad8\u753b\u8cea\u5316\u3055\u308c\u307e\u3059\n                <\/p>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Services -->\n    <section class=\"solution container\">\n        <div class=\"text-center fade-in-up\">\n            <span class=\"section-subtitle\">SERVICE MENU<\/span>\n            <h2 class=\"section-title\">\u30b5\u30fc\u30d3\u30b9\u5185\u5bb9<\/h2>\n        <\/div>\n        <div class=\"service-cards\">\n            <div class=\"card fade-in-up\">\n                <div class=\"card-icon\"><i class=\"fa-solid fa-image\"><\/i><\/div>\n                <h3>\u5199\u771f\u3092\u30ad\u30ec\u30a4\u306b<\/h3>\n                <ul><li>\u30ac\u30e9\u30b1\u30fc\u753b\u8cea\u3082\u304f\u3063\u304d\u308a\u30ad\u30ec\u30a4\u306b<\/li><li>\u4f59\u8a08\u306a\u3082\u306e\u306e\u6d88\u53bb\uff08\u30ea\u30fc\u30c9\u7b49\uff09<\/li><li>\u30b6\u30e9\u3064\u304d\u9664\u53bb\u30fb\u8272\u3092\u660e\u308b\u304f<\/li><\/ul>\n            <\/div>\n            <div class=\"card fade-in-up\">\n                <div class=\"card-icon\"><i class=\"fa-solid fa-film\"><\/i><\/div>\n                <h3>\u52d5\u753b\u3092\u30ad\u30ec\u30a4\u306b<\/h3>\n                <ul><li>\u30ab\u30af\u30ab\u30af\u52d5\u753b\u3092\u306a\u3081\u3089\u304b\u306b<\/li><li>\u624b\u30d6\u30ec\u88dc\u6b63<\/li><li>\u30b9\u30de\u30db\u3067\u898b\u3084\u3059\u3044\u30b5\u30a4\u30ba\u306b<\/li><\/ul>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Price -->\n    <section id=\"price\" class=\"price-section\">\n        <div class=\"container\">\n            <div class=\"text-center fade-in-up\">\n                <span class=\"section-subtitle\">PRICE PLAN<\/span>\n                <h2 class=\"section-title\">\u6599\u91d1\u30d7\u30e9\u30f3<\/h2>\n            <\/div>\n            <div class=\"price-grid\">\n                <div class=\"price-card fade-in-up\">\n                    <h3>\u5199\u771f\u30d7\u30e9\u30f3<\/h3>\n                    <div class=\"price-amount\"><span><\/span><\/div>\n                    <ul class=\"price-menu\">\n                        <li><span class=\"label\">\u307e\u305a\u306f\u304a\u8a66\u3057\uff083\u679a\uff09<\/span><span class=\"value\">3,000\u5186<\/span><\/li>\n                        <li><span class=\"label\">\u3082\u3063\u3068\u305f\u304f\u3055\u3093<small>\uff08\u8ffd\u52a03\u679a\u3054\u3068\uff09<\/small><\/span><span class=\"value\">\uff0b2,000\u5186<\/span><\/li>\n                    <\/ul>\n                    <a href=\"#contact\" class=\"btn btn-primary\" style=\"background:#8d6e63;\">\u76f8\u8ac7\u3059\u308b<\/a>\n                <\/div>\n\n                <div class=\"price-card recommended fade-in-up\">\n                    <div class=\"badge\">\u4eba\u6c17No.1<\/div>\n                    <h3>\u52d5\u753b\u30d7\u30e9\u30f3<\/h3>\n                    <div class=\"price-amount\">\u00a53,000<span>\u301c<\/span><\/div>\n                    <ul class=\"price-menu\">\n                        <li><span class=\"label\">\u3061\u3087\u3063\u3068\u3057\u305f\u77ac\u9593<small>\uff08\uff5e15\u79d2\uff09<\/small><\/span><span class=\"value\">3,000\u5186<\/span><\/li>\n                        <li><span class=\"label\">\u5b9a\u756a\u306e\u9577\u3055<small>\uff08\uff5e30\u79d2\uff09<\/small><\/span><span class=\"value\">5,000\u5186<\/span><\/li>\n                        <li><span class=\"label\">\u3057\u3063\u304b\u308a\u6b8b\u3059<small>\uff08\uff5e45\u79d2\uff09<\/small><\/span><span class=\"value\">8,000\u5186<\/span><\/li>\n                        <li><span class=\"label\">\u305f\u3063\u3077\u308a1\u5206<small>\uff08\uff5e60\u79d2\uff09<\/small><\/span><span class=\"value\">9,800\u5186<\/span><\/li>\n                        <li><span class=\"label\">1\u5206\u4ee5\u4e0a<\/span><span class=\"value\" style=\"font-size:0.9em\">\u500b\u5225\u76f8\u8ac7<\/span><\/li>\n                        <li class=\"option\" style=\"margin-top: 10px; border-top: 1px solid #ddd; padding-top: 10px;\">\n                            <span class=\"label\" style=\"font-size: 0.85rem; color:#d35400;\">\u203b\u52d5\u753b\u306e\u3053\u3053\u3060\u3051\u30ad\u30ec\u30a4\u306b\u3057\u305f\u3044<\/span>\n                            <span class=\"value\">\u4e0a\u8a18\uff0b1,000\u5186<\/span>\n                        <\/li>\n                    <\/ul>\n                    <a href=\"#contact\" class=\"btn btn-primary\">\u3053\u306e\u30d7\u30e9\u30f3\u3067\u76f8\u8ac7<\/a>\n                <\/div>\n            <\/div>\n            <p class=\"price-note\">\u203b\u5185\u5bb9\u306b\u3088\u308a\u304a\u898b\u7a4d\u308a\u3002\u307e\u305a\u306f\u304a\u6c17\u8efd\u306b\u3054\u76f8\u8ac7\u304f\u3060\u3055\u3044\u3002<\/p>\n        <\/div>\n    <\/section>\n\n    <!-- Flow Section (New Order) -->\n    <section class=\"flow-section\">\n        <div class=\"container\">\n            <div class=\"text-center fade-in-up\">\n                <span class=\"section-subtitle\">USAGE FLOW<\/span>\n                <h2 class=\"section-title\">\u3054\u5229\u7528\u306e\u6d41\u308c<\/h2>\n            <\/div>\n            <div class=\"flow-grid\">\n                <div class=\"flow-item fade-in-up\">\n                    <div class=\"flow-num\">1<\/div>\n                    <div class=\"flow-content\">\n                        <h3>LINE\u30fb\u30e1\u30fc\u30eb\u3067\u76f8\u8ac7<\/h3>\n                        <p>\u5199\u771f\u3092\u9001\u308b\u3060\u3051\u3067\u3001\u4ed5\u4e0a\u304c\u308a\u4e88\u6e2c\u3092\u3054\u6848\u5185\u3057\u307e\u3059\u3002<br><span style=\"font-size:0.85rem; color:#888;\">\u203b\u6539\u5584\u304c\u9650\u5b9a\u7684\u306a\u5834\u5408\u306f\u3001\u4ed6\u306e\u753b\u50cf\u3092\u3054\u63d0\u6848\u3059\u308b\u5834\u5408\u304c\u3054\u3056\u3044\u307e\u3059\u3002<\/span><\/p>\n                    <\/div>\n                <\/div>\n                <div class=\"flow-item fade-in-up\">\n                    <div class=\"flow-num\">2<\/div>\n                    <div class=\"flow-content\">\n                        <h3>\u304a\u898b\u7a4d\u308a\u30fb\u304a\u652f\u6255<\/h3>\n                        <p>\u5185\u5bb9\u306b\u7d0d\u5f97\u3044\u305f\u3060\u3051\u307e\u3057\u305f\u3089\u3001\u304a\u652f\u6255\u3044\u3078\u9032\u307f\u307e\u3059\u3002<\/p>\n                    <\/div>\n                <\/div>\n                <div class=\"flow-item fade-in-up\">\n                    <div class=\"flow-num\">3<\/div>\n                    <div class=\"flow-content\">\n                        <h3>AI\u9ad8\u753b\u8cea\u5316\u4f5c\u696d<\/h3>\n                        <p>\u30b9\u30bf\u30c3\u30d5\u304c\u4e01\u5be7\u306b\u4e00\u679a\u305a\u3064\u3001\u4fee\u5fa9\u30fb\u88dc\u6b63\u3057\u307e\u3059\u3002<\/p>\n                    <\/div>\n                <\/div>\n                <div class=\"flow-item fade-in-up\">\n                    <div class=\"flow-num\">4<\/div>\n                    <div class=\"flow-content\">\n                        <h3>\u7d0d\u54c1<\/h3>\n                        <p>\u901a\u5e383\u301c5\u65e5\u4ee5\u5185\u306b\u3001\u5b8c\u6210\u30c7\u30fc\u30bf\u3092Google\u30c9\u30e9\u30a4\u30d6\u7d4c\u7531\u3067\u5171\u6709\u3044\u305f\u3057\u307e\u3059\u3002<br><span style=\"font-size:0.85rem; color:#888;\">\u203b\u753b\u50cf\u3084\u52d5\u753b\u306e\u91cf\u306b\u3088\u3063\u3066\u306f\u30015\u65e5\u4ee5\u4e0a\u304b\u304b\u308b\u5834\u5408\u304c\u3054\u3056\u3044\u307e\u3059\u3002<\/span><\/p>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Contact (Before FAQ) -->\n    <section id=\"contact\" class=\"cta-section\">\n        <div class=\"container\">\n            <div class=\"cta-box fade-in-up\">\n                <h2 class=\"section-title text-center\" style=\"display:block;\">\u7121\u6599\u76f8\u8ac7\u30fb\u304a\u898b\u7a4d\u308a<\/h2>\n                <div class=\"contact-grid\">\n                    <!-- Left: LINE -->\n                    <div class=\"contact-left\">\n                        <p class=\"contact-lead\">\u30b9\u30de\u30db\u306b\u7720\u3063\u3066\u3044\u308b\u5927\u5207\u306a\u30c7\u30fc\u30bf\u3092\u3001\u4e00\u751f\u30e2\u30ce\u306e\u5b9d\u7269\u306b\u5909\u3048\u307e\u305b\u3093\u304b\uff1f<br>\u307e\u305a\u306f\u7121\u6599\u76f8\u8ac7\u30fb\u304a\u898b\u7a4d\u308a\u304b\u3089\u3002<\/p>\n                        <div class=\"line-promo-box\">\n                            <span class=\"line-promo-label\">\uff3c \u304a\u3059\u3059\u3081\uff01LINE\u3067\u7c21\u5358\u76f8\u8ac7 \uff0f<\/span>\n                            <p class=\"line-promo-text\">\u5199\u771f\u3092\u9001\u308b\u3060\u3051\u3067<br>\u4ed5\u4e0a\u304c\u308a\u30a4\u30e1\u30fc\u30b8\u3084\u304a\u898b\u7a4d\u308a\u3092\u304a\u9001\u308a\u3057\u307e\u3059\u3002<br>\u9762\u5012\u306a\u5165\u529b\u306f\u4e00\u5207\u4e0d\u8981\u3067\u3059\u2728<\/p>\n                            <div class=\"cta-buttons\">\n                                <!-- \u516c\u5f0fLINE\u30ea\u30f3\u30af\u8a2d\u5b9a -->\n                                <a href=\"https:\/\/lin.ee\/xErT2yh\" target=\"_blank\" class=\"btn btn-line-large\" rel=\"noopener\">\n                                    <i class=\"fa-brands fa-line\" style=\"margin-right:15px; font-size: 1.8rem;\"><\/i>\n                                    \u516c\u5f0fLINE<br>\u3067\u76f8\u8ac7\u3059\u308b\n                                <\/a>\n                            <\/div>\n                            <p style=\"font-size: 0.8rem; margin-top: 15px; color: #166534;\">\u203b\u5f37\u5f15\u306a\u52e7\u8a98\u306f\u4e00\u5207\u3054\u3056\u3044\u307e\u305b\u3093<\/p>\n                        <\/div>\n                    <\/div>\n\n                    <!-- Right: Mail Form -->\n                    <div class=\"contact-form-wrapper\">\n                        <p class=\"form-title\">\u30e1\u30fc\u30eb\u3067\u306e\u3054\u76f8\u8ac7\u306f\u3053\u3061\u3089<\/p>\n                        <form action=\"mailto:shippomemories@gmail.com\" method=\"post\" enctype=\"text\/plain\">\n                            <div class=\"form-group\"><label class=\"form-label\">\u304a\u540d\u524d<span class=\"form-tag\">\u5fc5\u9808<\/span><\/label><input type=\"text\" name=\"name\" class=\"form-input\" placeholder=\"\u3057\u3063\u307d\u592a\u90ce\"><\/div>\n                            <div class=\"form-group\"><label class=\"form-label\">\u30e1\u30fc\u30eb\u30a2\u30c9\u30ec\u30b9<span class=\"form-tag\">\u5fc5\u9808<\/span><\/label><input type=\"email\" name=\"email\" class=\"form-input\" placeholder=\"example@email.com\"><\/div>\n                            <div class=\"form-group\"><label class=\"form-label\">\u30da\u30c3\u30c8\u306e\u7a2e\u985e<\/label><input type=\"text\" name=\"pet_type\" class=\"form-input\" placeholder=\"\u30c8\u30a4\u30d7\u30fc\u30c9\u30eb\u7b49\"><\/div>\n                            <div class=\"form-group\"><label class=\"form-label\">\u3054\u76f8\u8ac7\u5185\u5bb9<span class=\"form-tag\">\u5fc5\u9808<\/span><\/label><textarea name=\"message\" class=\"form-textarea\" placeholder=\"\u53e4\u3044\u52d5\u753b\u3092\u7dba\u9e97\u306b\u3057\u305f\u3044\u3001\u7b49\"><\/textarea><\/div>\n                            <button type=\"submit\" class=\"btn btn-submit\">\u9001\u4fe1\u3059\u308b <i class=\"fa-solid fa-paper-plane\" style=\"margin-left:8px;\"><\/i><\/button>\n                            <!-- \u2605\u8996\u8a8d\u6027\u5411\u4e0a\u7248\u306e\u6ce8\u91c8 -->\n                            <p class=\"form-note\">\u203b\u30e1\u30fc\u30eb\u30a2\u30d7\u30ea\u304c\u7acb\u3061\u4e0a\u304c\u308a\u307e\u3059\u306e\u3067\u3001\u305d\u306e\u307e\u307e\u30e1\u30fc\u30eb\u3092\u304a\u9001\u308a\u304f\u3060\u3055\u3044<\/p>\n                        <\/form>\n                    <\/div>\n                <\/div>\n                <p class=\"portfolio-note\">\n                    \u203b\u4f5c\u6210\u3057\u305f\u753b\u50cf\u30fb\u52d5\u753b\uff08\u52a0\u5de5\u524d\u5f8c\uff09\u306f\u3001\u5236\u4f5c\u5b9f\u7e3e\u3068\u3057\u3066\u5f53\u30b5\u30a4\u30c8\u3084SNS\u7b49\u3067\u7d39\u4ecb\u3055\u305b\u3066\u3044\u305f\u3060\u304f\u5834\u5408\u304c\u3054\u3056\u3044\u307e\u3059\u3002<br>\n                    \u63b2\u8f09\u3092\u5e0c\u671b\u3055\u308c\u306a\u3044\u5834\u5408\u306f\u3001\u304a\u7533\u3057\u8fbc\u307f\u6642\u306b\u300c\u63b2\u8f09\u4e0d\u53ef\u300d\u3068\u304a\u77e5\u3089\u305b\u3044\u305f\u3060\u3051\u308c\u3070\u516c\u958b\u306f\u3044\u305f\u3057\u307e\u305b\u3093\u306e\u3067\u3054\u5b89\u5fc3\u304f\u3060\u3055\u3044\u3002\n                <\/p>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- FAQ (Moved to end) -->\n    <section id=\"faq\" class=\"faq-section\">\n        <div class=\"container\">\n            <div class=\"text-center fade-in-up\">\n                <span class=\"section-subtitle\">Q&#038;A<\/span>\n                <h2 class=\"section-title\">\u3088\u304f\u3042\u308b\u8cea\u554f<\/h2>\n            <\/div>\n            <div class=\"faq-list fade-in-up\">\n                <details class=\"faq-item\">\n                    <summary class=\"faq-summary\"><span class=\"faq-q-mark\">Q.<\/span>\u30ac\u30e9\u30b1\u30fc\u3084\u53e4\u3044\u30b9\u30de\u30db\u306e\u5199\u771f\u3067\u3082\u7dba\u9e97\u306b\u306a\u308a\u307e\u3059\u304b\uff1f<\/summary>\n                    <div class=\"faq-answer\">\n                        \u306f\u3044\u3001\u53ef\u80fd\u3067\u3059\u3002\u6700\u65b0\u306eAI\u6280\u8853\u306b\u3088\u308a\u3001\u753b\u7d20\u6570\u306e\u4f4e\u3044\u753b\u50cf\u3084\u30ce\u30a4\u30ba\u306e\u591a\u3044\u753b\u50cf\u3067\u3082\u3001\u9bae\u660e\u306b\u5fa9\u5143\u30fb\u9ad8\u753b\u8cea\u5316\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<br><br>\n                        <small style=\"color:#666;\">\u203b\u305f\u3060\u3057\u3001\u5143\u753b\u50cf\u306e\u60c5\u5831\u304c\u6975\u3081\u3066\u5c11\u306a\u3044\u5834\u5408\u3084\u3001\u30d4\u30f3\u30dc\u30b1\u304c\u6fc0\u3057\u3059\u304e\u308b\u5834\u5408\u306f\u3001\u6539\u5584\u52b9\u679c\u304c\u9650\u5b9a\u7684\u3068\u306a\u308b\u53ef\u80fd\u6027\u304c\u3054\u3056\u3044\u307e\u3059\u3002\u307e\u305a\u306f\u7121\u6599\u76f8\u8ac7\u3067\u30c7\u30fc\u30bf\u3092\u304a\u9001\u308a\u304f\u3060\u3055\u3044\u3002<\/small>\n                    <\/div>\n                <\/details>\n                <details class=\"faq-item\">\n                    <summary class=\"faq-summary\"><span class=\"faq-q-mark\">Q.<\/span>\u52d5\u753b\u306e\u9577\u3055\u304c1\u5206\u3092\u8d85\u3048\u308b\u306e\u3067\u3059\u304c\u3001\u4f9d\u983c\u3067\u304d\u307e\u3059\u304b\uff1f<\/summary>\n                    <div class=\"faq-answer\">\n                        \u306f\u3044\u30011\u5206\u4ee5\u4e0a\u306e\u52d5\u753b\u3082\u5bfe\u5fdc\u53ef\u80fd\u3067\u3059\u3002<br>\n                        \u307e\u305f\u3001\u9577\u3044\u52d5\u753b\u306e\u4e2d\u304b\u3089**\u300c\u304a\u6c17\u306b\u5165\u308a\u306e\u77ac\u9593\u3060\u3051\uff0815\u79d2\u306a\u3069\uff09\u3092\u6307\u5b9a\u3057\u3066\u9ad8\u753b\u8cea\u5316\u300d**\u3059\u308b\u3053\u3068\u3082\u53ef\u80fd\u3067\u3059\u3002<br>\n                        \u307e\u305a\u306f\u7121\u6599\u76f8\u8ac7\u306b\u3066\u52d5\u753b\u3092\u304a\u9001\u308a\u304f\u3060\u3055\u3044\u3002\u3054\u5e0c\u671b\u306b\u5408\u308f\u305b\u3066\u304a\u898b\u7a4d\u308a\u3055\u305b\u3066\u3044\u305f\u3060\u304d\u307e\u3059\u3002\n                    <\/div>\n                <\/details>\n                <details class=\"faq-item\">\n                    <summary class=\"faq-summary\"><span class=\"faq-q-mark\">Q.<\/span>\u6599\u91d1\u306e\u652f\u6255\u3044\u65b9\u6cd5\u3092\u6559\u3048\u3066\u304f\u3060\u3055\u3044\u3002<\/summary>\n                    <div class=\"faq-answer\">\u73fe\u5728\u306f\u300c\u9280\u884c\u632f\u8fbc\u300d\u3068\u300cPayPay\u300d\u306b\u5bfe\u5fdc\u3057\u3066\u304a\u308a\u307e\u3059\u3002\u30c7\u30fc\u30bf\u306e\u78ba\u8a8d\u5f8c\u306b\u304a\u898b\u7a4d\u308a\u3092\u304a\u9001\u308a\u3057\u307e\u3059\u306e\u3067\u3001\u3054\u5e0c\u671b\u306e\u65b9\u6cd5\u3067\u304a\u652f\u6255\u3044\u3092\u304a\u9858\u3044\u3044\u305f\u3057\u307e\u3059\u3002<\/div>\n                <\/details>\n                <details class=\"faq-item\">\n                    <summary class=\"faq-summary\"><span class=\"faq-q-mark\">Q.<\/span>\u7d0d\u671f\u306f\u3069\u306e\u304f\u3089\u3044\u3067\u3059\u304b\uff1f<\/summary>\n                    <div class=\"faq-answer\">\u901a\u5e38\u3001\u3054\u5165\u91d1\u78ba\u8a8d\u5f8c\u304b\u30893\u301c5\u65e5\u7a0b\u5ea6\u3067\u7d0d\u54c1\u3055\u305b\u3066\u3044\u305f\u3060\u304d\u307e\u3059\u3002<br>\u203b\u753b\u50cf\u3084\u52d5\u753b\u306e\u91cf\u306b\u3088\u3063\u3066\u306f\u30015\u65e5\u4ee5\u4e0a\u304b\u304b\u308b\u5834\u5408\u304c\u3054\u3056\u3044\u307e\u3059\u3002<br>\u304a\u6025\u304e\u306e\u5834\u5408\u306f\u3054\u76f8\u8ac7\u304f\u3060\u3055\u3044\u3002<\/div>\n                <\/details>\n                <details class=\"faq-item\">\n                    <summary class=\"faq-summary\"><span class=\"faq-q-mark\">Q.<\/span>\u30ad\u30e3\u30f3\u30bb\u30eb\u306f\u3067\u304d\u307e\u3059\u304b\uff1f<\/summary>\n                    <div class=\"faq-answer\">\u4f5c\u696d\u958b\u59cb\u524d\u3067\u3042\u308c\u3070\u30ad\u30e3\u30f3\u30bb\u30eb\u53ef\u80fd\u3067\u3059\u3002\u4f5c\u696d\u958b\u59cb\u5f8c\u306e\u30ad\u30e3\u30f3\u30bb\u30eb\u306f\u539f\u5247\u3068\u3057\u3066\u304a\u53d7\u3051\u3067\u304d\u307e\u305b\u3093\u306e\u3067\u3054\u4e86\u627f\u304f\u3060\u3055\u3044\u3002<\/div>\n                <\/details>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- Footer (Changed to DIV for compatibility) -->\n    <div class=\"shippo-footer\">\n        <div class=\"container\">\n            <span class=\"footer-logo\"><i class=\"fa-solid fa-paw\"><\/i> \u3057\u3063\u307d\u30e1\u30e2\u30ea\u30fc\u30ba<\/span>\n            <div class=\"footer-sns\">\n                <a href=\"https:\/\/www.instagram.com\/shippo.memories\/\" target=\"_blank\" rel=\"noopener\"><i class=\"fa-brands fa-instagram\"><\/i><\/a>\n                <!-- \u30d5\u30c3\u30bf\u30fcLINE\u30ea\u30f3\u30af\u8a2d\u5b9a -->\n                <a href=\"https:\/\/lin.ee\/xErT2yh\" target=\"_blank\" rel=\"noopener\"><i class=\"fa-brands fa-line\"><\/i><\/a>\n            <\/div>\n            <div class=\"footer-links\">\n                <a href=\"https:\/\/www.shippomemories.com\/?page_id=224\">\u904b\u55b6\u8005\u60c5\u5831<\/a>\n                <a href=\"https:\/\/www.shippomemories.com\/?page_id=239\">\u30d7\u30e9\u30a4\u30d0\u30b7\u30fc\u30dd\u30ea\u30b7\u30fc<\/a>\n                <a href=\"https:\/\/www.shippomemories.com\/?page_id=263\">\u5229\u7528\u898f\u7d04<\/a>\n            <\/div>\n            <p>\u3042\u306e\u65e5\u306e\u8a18\u61b6\u3092\u3001\u3082\u3063\u3068\u9bae\u660e\u306b\u3002<\/p>\n            <div class=\"copyright\">&copy; 2026 Shippo Memories.<\/div>\n        <\/div>\n    <\/div>\n\n<\/div>\n<!-- LP Wrapper End -->\n\n<!-- Scripts -->\n<script>\n    document.addEventListener('DOMContentLoaded', function() {\n        const wrapper = document.querySelector('.shippo-lp-wrapper');\n        \n        \/\/ --- Remove JIN:R Elements (JS Fallback) ---\n        const elementsToRemove = [\n            '.jin-header', '.jinr-header', '#header-box',\n            '.jin-footer', '.jinr-footer', '#footer-box',\n            '.jinr-bread-crumb', '.jin-breadcrumb', '#breadcrumb',\n            '#page-top', '.jinr-page-title-area', '.jinr-site-header', '.jinr-site-footer'\n        ];\n        elementsToRemove.forEach(selector => {\n            document.querySelectorAll(selector).forEach(el => el.style.display = 'none');\n        });\n\n        \/\/ Header Scroll\n        const header = document.getElementById('shippo-header');\n        window.addEventListener('scroll', () => { \n            if(header) {\n                window.scrollY > 50 ? header.classList.add('scrolled') : header.classList.remove('scrolled'); \n            }\n        });\n\n        \/\/ Scroll Animation\n        const observer = new IntersectionObserver((entries) => {\n            entries.forEach(entry => { if (entry.isIntersecting) { entry.target.classList.add('is-visible'); } });\n        }, { threshold: 0.1 });\n        wrapper.querySelectorAll('.fade-in-up').forEach(el => observer.observe(el));\n\n        \/\/ Smooth Scroll with Position Adjustment\n        document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\n            anchor.addEventListener('click', function (e) {\n                e.preventDefault();\n                const targetId = this.getAttribute('href');\n                const targetElement = document.querySelector(targetId);\n                \n                if (targetElement) {\n                    const elementRect = targetElement.getBoundingClientRect();\n                    const absoluteElementTop = elementRect.top + window.pageYOffset;\n                    const windowHeight = window.innerHeight;\n                    let targetScrollPosition;\n\n                    if (targetId === '#comparison') {\n                        \/\/ Center the comparison section\n                        targetScrollPosition = absoluteElementTop - (windowHeight \/ 2) + (targetElement.offsetHeight \/ 2);\n                    } else if (targetId === '#contact') {\n                        \/\/ Focus on the LINE promo box if available, else center the section\n                        const promoBox = targetElement.querySelector('.line-promo-box');\n                        if (promoBox) {\n                            const promoRect = promoBox.getBoundingClientRect();\n                            const absolutePromoTop = promoRect.top + window.pageYOffset;\n                            targetScrollPosition = absolutePromoTop - (windowHeight \/ 2) + (promoBox.offsetHeight \/ 2);\n                        } else {\n                            targetScrollPosition = absoluteElementTop - (windowHeight \/ 2) + (targetElement.offsetHeight \/ 2);\n                        }\n                    } else {\n                        \/\/ Default scroll\n                        targetScrollPosition = absoluteElementTop - 100;\n                    }\n\n                    window.scrollTo({\n                        top: targetScrollPosition,\n                        behavior: 'smooth'\n                    });\n                }\n            });\n        });\n\n        \/\/ Tab Switching\n        window.switchTab = function(type) {\n            wrapper.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active'));\n            event.target.closest('.tab-btn').classList.add('active');\n            \n            wrapper.querySelectorAll('.comparison-content').forEach(content => {\n                content.classList.remove('active');\n                content.style.opacity = '0';\n                setTimeout(() => {\n                    if(!content.classList.contains('active')) content.style.display = 'none';\n                }, 300);\n            });\n\n            const target = document.getElementById('comp-' + type);\n            target.style.display = 'block';\n            setTimeout(() => {\n                target.classList.add('active');\n                target.style.opacity = '1';\n            }, 10);\n        };\n\n        \/\/ Image Slider Logic\n        const imgWrapper = document.getElementById('slider-image');\n        if(imgWrapper) {\n            const imgBefore = imgWrapper.querySelector('.img-before-layer');\n            const handle = imgWrapper.querySelector('.slider-handle');\n            const moveSlider = (clientX) => {\n                const rect = imgWrapper.getBoundingClientRect();\n                let pos = ((clientX - rect.left) \/ rect.width) * 100;\n                pos = Math.max(0, Math.min(100, pos));\n                imgBefore.style.clipPath = `inset(0 ${100 - pos}% 0 0)`;\n                handle.style.left = `${pos}%`;\n            };\n            imgWrapper.addEventListener('mousemove', (e) => moveSlider(e.clientX));\n            imgWrapper.addEventListener('touchmove', (e) => moveSlider(e.touches[0].clientX));\n        }\n\n        \/\/ Video Hold & Sync\n        const vidWrapper = document.getElementById('slider-video');\n        const statusLabel = document.getElementById('video-status');\n        const vBeforeLayer = document.querySelector('.video-before');\n        const vAfterLayer = document.querySelector('.video-after');\n\n        if(vidWrapper && statusLabel && vBeforeLayer && vAfterLayer) {\n            const showAfter = (e) => {\n                e.preventDefault(); \n                vAfterLayer.style.opacity = '1';\n                vBeforeLayer.style.opacity = '0';\n                statusLabel.textContent = \"\u9ad8\u753b\u8cea\u5316\";\n                statusLabel.style.background = \"rgba(230, 126, 34, 0.9)\"; \/\/ Orange accent\n                vidWrapper.classList.add('is-holding');\n            };\n\n            const showBefore = () => {\n                vAfterLayer.style.opacity = '0';\n                vBeforeLayer.style.opacity = '1';\n                statusLabel.textContent = \"\u5143\u52d5\u753b\";\n                statusLabel.style.background = \"rgba(0, 0, 0, 0.6)\"; \/\/ Dark default\n                vidWrapper.classList.remove('is-holding');\n            };\n\n            \/\/ Touch\/Mouse events for holding\n            vidWrapper.addEventListener('mousedown', showAfter);\n            vidWrapper.addEventListener('touchstart', showAfter, {passive: false});\n            \n            window.addEventListener('mouseup', showBefore);\n            window.addEventListener('touchend', showBefore);\n            window.addEventListener('touchcancel', showBefore);\n\n            \/\/ Sync videos logic remains same\n            const vAfter = document.getElementById('vid-after');\n            const vBefore = document.getElementById('vid-before');\n            const syncVideos = (source, target) => {\n                if (Math.abs(source.currentTime - target.currentTime) > 0.1) target.currentTime = source.currentTime;\n                if (!source.paused && target.paused) target.play();\n                if (source.paused && !target.paused) target.pause();\n            };\n            if(vAfter && vBefore) {\n                vAfter.addEventListener('play', () => vBefore.play());\n                vAfter.addEventListener('pause', () => vBefore.pause());\n                vAfter.addEventListener('seeking', () => vBefore.currentTime = vAfter.currentTime);\n                vAfter.addEventListener('timeupdate', () => syncVideos(vAfter, vBefore));\n            }\n        }\n\n        \/\/ Form Submit\n        const form = document.querySelector('.contact-form-wrapper form');\n        if (form) {\n            form.addEventListener('submit', function(e) {\n                e.preventDefault();\n                const name = form.querySelector('input[name=\"name\"]').value;\n                const email = form.querySelector('input[name=\"email\"]').value;\n                const petType = form.querySelector('input[name=\"pet_type\"]').value;\n                const message = form.querySelector('textarea[name=\"message\"]').value;\n                const subject = \"\u3010\u3057\u3063\u307d\u30e1\u30e2\u30ea\u30fc\u30ba\u3011\u304a\u554f\u3044\u5408\u308f\u305b\";\n                const body = `\u304a\u540d\u524d: ${name}%0D%0A\u30e1\u30fc\u30eb\u30a2\u30c9\u30ec\u30b9: ${email}%0D%0A\u30da\u30c3\u30c8\u306e\u7a2e\u985e: ${petType}%0D%0A%0D%0A\u3054\u76f8\u8ac7\u5185\u5bb9:%0D%0A${message}`;\n                window.location.href = `mailto:shippomemories@gmail.com?subject=${subject}&body=${body}`;\n            });\n        }\n    });\n<\/script>\n<\/body>\n<\/html>\n<\/div><\/section><\/section>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_jinr_url_youtube":"","_jinr_pip_youtube":false,"_jinr_time_youtube":"","_jinr_thumb_youtube":"","_jinr_media_youtube":"","_jinr_category_edit":false,"_jinr_category":"","_jinr_title_display":false,"_jinr_snsbutton_display":false,"_jinr_ads_display":false,"_jinr_thumbnail_display":false,"_jinr_profile_display":false,"_jinr_representations_display":false,"_jinr_relatedpost_display":false,"_jinr_sidebar1col_display":false,"_jinr_sidebar2col_display":false,"_jinr_seotitle_display":"","_jinr_description_display":"","_jinr_keyword_display":"","_jinr_hastag_display":"","_jinr_canonical_display":"","_jinr_noindex_display":false,"_jinr_paidpost":false,"_jinr_paidpost_product_id":"","_jinr_headtag_article":"","footnotes":""},"class_list":["post-221","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.shippomemories.com\/index.php?rest_route=\/wp\/v2\/pages\/221","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.shippomemories.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.shippomemories.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.shippomemories.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.shippomemories.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=221"}],"version-history":[{"count":33,"href":"https:\/\/www.shippomemories.com\/index.php?rest_route=\/wp\/v2\/pages\/221\/revisions"}],"predecessor-version":[{"id":288,"href":"https:\/\/www.shippomemories.com\/index.php?rest_route=\/wp\/v2\/pages\/221\/revisions\/288"}],"wp:attachment":[{"href":"https:\/\/www.shippomemories.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=221"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}