/* 「ご注文の流れ」ブロック（membership-point-card.html と同じ見た目）。同ページの適用済みルールを抜き出したもの。 */
body.has-app-mobile-header .m-card, body.has-app-mobile-header .mpd-section, body.has-app-mobile-header .m-section > .m-card, body.has-app-mobile-header .m-summary-card, body.has-app-mobile-header .m-form-card, body.has-app-mobile-header .m-stats-card, body.has-app-mobile-header .m-ticket-card, body.has-app-mobile-header .m-coupon-card { border-color: rgba(60, 60, 67, 0.1) !important; border-radius: 20px !important; box-shadow: rgba(15, 23, 42, 0.055) 0px 10px 28px !important; }
body.has-app-mobile-header h1, body.has-app-mobile-header h2, body.has-app-mobile-header h3 { letter-spacing: -0.025em; }
* { margin: 0px; padding: 0px; box-sizing: border-box; }
h1, h2, h3, h4, h5, h6, strong, b { font-weight: 400; }
.m-section { margin: 14px 14px 0px; }
.m-card { background: rgb(255, 255, 255); border-radius: 14px; padding: 16px; }
.m-order-card { padding: 18px 12px 14px; }
.m-apple-order-flow { background: rgb(245, 245, 247) !important; border-radius: 0px !important; box-shadow: none !important; padding: 46px 0px 54px !important; overflow: hidden !important; }
.m-apple-flow-head { padding: 0px 28px !important; }
.m-apple-flow-eyebrow { margin: 0px 0px 14px !important; color: rgb(110, 110, 115) !important; font-size: 17px !important; font-weight: 700 !important; letter-spacing: -0.02em !important; }
.m-apple-flow-head h2 { margin: 0px !important; color: rgb(29, 29, 31) !important; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif !important; font-size: clamp(18px, 4.8vw, 24px) !important; font-weight: 700 !important; line-height: 1.08 !important; letter-spacing: -0.045em !important; text-align: left !important; }
.m-apple-flow-head p:not(.m-apple-flow-eyebrow) { margin: 20px 0px 0px !important; color: rgb(29, 29, 31) !important; font-size: 14px !important; font-weight: 650 !important; line-height: 1.65 !important; letter-spacing: -0.02em !important; }
.m-apple-flow-scroller { display: flex !important; gap: 16px !important; margin-top: 42px !important; padding: 0px 28px 10px !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; }
.m-apple-flow-card { position: relative !important; flex: 0 0 min(78vw, 310px) !important; min-height: 250px !important; padding: 24px 24px 28px !important; border-radius: 28px !important; background: rgb(255, 255, 255) !important; scroll-snap-align: start !important; }
.m-apple-flow-no { display: none !important; align-items: center !important; justify-content: center !important; width: 42px !important; height: 42px !important; border-radius: 999px !important; background: rgb(0, 113, 227) !important; color: rgb(255, 255, 255) !important; font-size: 14px !important; font-weight: 800 !important; letter-spacing: -0.02em !important; }
.m-apple-flow-card h3 { margin: 0px !important; color: rgb(29, 29, 31) !important; font-size: 20px !important; font-weight: 750 !important; line-height: 1.18 !important; letter-spacing: -0.035em !important; }
.m-apple-flow-card p { margin: 8px 0px 0px !important; color: rgb(110, 110, 115) !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1.45 !important; letter-spacing: -0.01em !important; }
.m-flow-symbol { position: relative !important; display: block !important; width: 96px !important; height: 76px !important; margin: 0px 0px 34px !important; }
.m-flow-symbol::before, .m-flow-symbol::after { content: "" !important; position: absolute !important; display: block !important; }
.m-flow-symbol-card::before { width: 86px !important; height: 52px !important; left: 5px !important; top: 12px !important; border-radius: 12px !important; background: linear-gradient(135deg, rgb(234, 245, 255), rgb(141, 204, 255)) !important; box-shadow: rgba(0, 113, 227, 0.16) 0px 12px 24px !important; transform: rotate(-8deg) !important; }
.m-flow-symbol-card::after { width: 54px !important; height: 8px !important; left: 20px !important; top: 38px !important; border-radius: 999px !important; background: rgb(0, 113, 227) !important; transform: rotate(-8deg) !important; }
.m-flow-symbol-order::before { width: 54px !important; height: 72px !important; left: 21px !important; top: 2px !important; border-radius: 14px !important; border: 4px solid rgb(29, 29, 31) !important; background: rgb(255, 255, 255) !important; }
.m-flow-symbol-order::after { width: 42px !important; height: 22px !important; left: 27px !important; top: 36px !important; border-radius: 999px !important; background: rgb(0, 113, 227) !important; }
.m-flow-symbol-proof::before { width: 72px !important; height: 52px !important; left: 12px !important; top: 10px !important; border-radius: 14px !important; border: 4px solid rgb(143, 197, 244) !important; background: rgb(255, 255, 255) !important; }
.m-flow-symbol-proof::after { width: 28px !important; height: 28px !important; right: 2px !important; bottom: 3px !important; border-radius: 50% !important; border: 5px solid rgb(0, 113, 227) !important; box-shadow: rgb(0, 113, 227) 16px 14px 0px -12px !important; }
.m-flow-symbol-print::before { width: 76px !important; height: 48px !important; left: 10px !important; top: 16px !important; border-radius: 14px !important; background: linear-gradient(rgb(242, 247, 255), rgb(201, 231, 255)) !important; border: 3px solid rgb(184, 215, 245) !important; }
.m-flow-symbol-print::after { width: 64px !important; height: 18px !important; left: 16px !important; top: 42px !important; border-radius: 8px !important; background: linear-gradient(90deg, rgb(19, 168, 232) 0px, rgb(19, 168, 232) 25%, rgb(255, 59, 48) 25%, rgb(255, 59, 48) 50%, rgb(255, 204, 0) 50%, rgb(255, 204, 0) 75%, rgb(52, 199, 89) 75%) !important; }
.m-flow-symbol-ship::before { width: 78px !important; height: 46px !important; left: 9px !important; top: 24px !important; border-radius: 10px !important; background: rgb(217, 154, 67) !important; }
.m-flow-symbol-ship::after { width: 50px !important; height: 30px !important; left: 23px !important; top: 8px !important; border-radius: 8px !important; background: rgb(246, 192, 111) !important; transform: skewX(-18deg) !important; }
.m-use-premium-section, .m-apple-order-flow, .m-apple-faq, .m-material-picker-apple { margin-top: 12px !important; margin-bottom: 12px !important; }
.m-apple-flow-scroller, .m-use-premium-scroll { padding-left: 26px !important; padding-right: 26px !important; scroll-padding-left: 26px !important; }
.m-apple-flow-card, .m-use-premium-card { box-shadow: none !important; border: 1px solid rgba(0, 0, 0, 0.04) !important; }
.m-apple-flow-card:first-child, .m-use-premium-card:first-child { margin-left: 0px !important; }
.m-apple-flow-card:last-child, .m-use-premium-card:last-child { margin-right: 10px !important; }
body [class*="sticky"], body [class*="Sticky"], body [class*="fixed"], body [class*="Fixed"], body [class*="scroll"], body [class*="Scroll"], body [class*="is-show"], body [class*="isShow"], body [class*="is-active"], body [class*="isActive"] { box-shadow: none !important; }
.m-apple-flow-scroller { display: grid !important; grid-template-columns: repeat(3, minmax(0px, 1fr)) !important; gap: 10px !important; margin-top: 42px !important; padding: 0px 20px 10px !important; overflow: visible !important; scroll-snap-type: none !important; }
.m-apple-flow-card { position: relative !important; flex: 0 0 auto !important; min-height: 224px !important; padding: 126px 10px 20px !important; border-radius: 22px !important; background: rgb(255, 255, 255) !important; display: flex !important; flex-direction: column !important; place-items: center !important; justify-content: center !important; text-align: center !important; scroll-snap-align: none !important; }
.m-apple-flow-card .m-flow-symbol { position: absolute !important; top: 34px !important; left: 0px !important; right: 0px !important; transform: none !important; width: 58px !important; height: 48px !important; margin: 0px auto !important; grid-row: auto !important; align-self: center !important; }
.m-apple-flow-card h3 { margin: 0px !important; align-self: auto !important; font-size: 14px !important; line-height: 1.2 !important; grid-row: auto !important; }
.m-apple-flow-card p { margin: 6px 0px 0px !important; align-self: auto !important; font-size: 10px !important; line-height: 1.35 !important; grid-row: auto !important; }
.m-apple-flow-head p:not(.m-apple-flow-eyebrow) { display: none !important; }
.m-apple-flow-card .m-flow-symbol { top: 30px !important; left: 50% !important; right: auto !important; width: 96px !important; height: 76px !important; margin: 0px 0px 0px -48px !important; transform: scale(0.68) !important; transform-origin: 50% 50% !important; }
.m-apple-flow-card .m-flow-symbol::before, .m-apple-flow-card .m-flow-symbol::after { box-sizing: border-box !important; }
.m-apple-flow-card { justify-content: flex-start !important; }
.m-apple-flow-card:last-child { margin-right: 0px !important; }
html body .submission-shell > .m-section { margin: 0 !important; }
html body .guide-shell > .m-section { margin: 0 !important; }