body.smp-florist { --fl-plum: #4a2240; --fl-pink: #f6e9ec; --fl-ink: #382330; --fl-line: #c8b2be; --fl-serif: 'Hiragino Mincho ProN', 'Yu Mincho', 'YuMincho', serif; background: #fff; color: var(--fl-ink); font-family: 'Zen Kaku Gothic New', sans-serif; line-height: 1.9; }
body.smp-florist .fl-wrap { width: min(1160px, calc(100% - 44px)); margin-inline: auto; }
body.smp-florist .fl-head { background: #fff; border-bottom: 1px solid var(--fl-line); }
body.smp-florist .fl-head-in { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 84px; }
body.smp-florist .fl-logo { display: inline-flex; align-items: center; min-height: 44px; color: var(--fl-plum); font-family: var(--fl-serif); font-size: 1.55rem; letter-spacing: .1em; text-decoration: none; white-space: nowrap; }
body.smp-florist .fl-nav { display: flex; gap: 30px; }
body.smp-florist .fl-nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--fl-ink); font-size: .88rem; text-decoration: none; }
body.smp-florist .fl-hero { display: grid; grid-template-columns: .92fr 1.08fr; min-height: 690px; background: var(--fl-pink); overflow: hidden; }
body.smp-florist .fl-hero-text { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 80px 30px 100px max(22px, calc((100vw - 1160px)/2)); }
body.smp-florist .fl-overline, body.smp-florist .fl-side-label { margin: 0 0 24px; color: var(--fl-plum); font-size: .85rem; letter-spacing: .15em; }
body.smp-florist .fl-hero h1 { margin: 0; color: var(--fl-plum); font-family: var(--fl-serif); font-size: clamp(2.6rem, 4.2vw, 4.9rem); font-weight: 500; line-height: 1.52; letter-spacing: .07em; }
body.smp-florist .fl-hero-text > p:not(.fl-overline) { max-width: 28em; margin: 28px 0; }
body.smp-florist .fl-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 26px; min-height: 48px; padding: 0 4px; border-bottom: 1px solid var(--fl-plum); color: var(--fl-plum); text-decoration: none; }
body.smp-florist .fl-hero-images { position: relative; min-width: 0; padding: 0 0 100px 0; }
body.smp-florist .fl-hero-main { width: 100%; height: 580px; object-fit: cover; }
body.smp-florist .fl-hero-small { position: absolute; left: 3%; bottom: 25px; width: 43%; height: 275px; object-fit: cover; border: 12px solid var(--fl-pink); }
body.smp-florist .fl-section { padding: 105px 0; }
body.smp-florist .fl-section h2 { margin: 0; color: var(--fl-plum); font-family: var(--fl-serif); font-size: clamp(2rem, 3.3vw, 3.45rem); font-weight: 500; line-height: 1.5; letter-spacing: .07em; }
body.smp-florist .fl-intro { padding: 145px 0; }
body.smp-florist .fl-intro-grid { display: grid; grid-template-columns: 1fr 1.7fr; gap: 70px; }
body.smp-florist .fl-intro-grid > div { max-width: 670px; }
body.smp-florist .fl-intro-grid > div p { max-width: 31em; margin: 30px 0 0; }
body.smp-florist .fl-choice { background: var(--fl-plum); color: #fff; }
body.smp-florist .fl-choice h2, body.smp-florist .fl-choice .fl-side-label { color: #fff; }
body.smp-florist .fl-choice-heading { display: grid; grid-template-columns: 1fr 1.7fr; gap: 70px; margin-bottom: 46px; }
body.smp-florist .fl-choice-heading p:last-child { margin: 18px 0 0; }
body.smp-florist .fl-choice-grid { display: grid; grid-template-columns: 1fr 1.7fr; gap: 70px; }
body.smp-florist .fl-choice-buttons { border-top: 1px solid #ac8c9e; }
body.smp-florist .fl-choice-buttons button { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 66px; padding: 8px 12px 8px 0; border: 0; border-bottom: 1px solid #ac8c9e; background: transparent; color: #fff; font: inherit; text-align: left; cursor: pointer; }
body.smp-florist .fl-choice-buttons button[aria-pressed="true"] { padding-left: 12px; background: #fff; color: var(--fl-plum); }
body.smp-florist .fl-recommendation { min-height: 360px; padding: 34px 40px; background: #fff; color: var(--fl-ink); }
body.smp-florist .fl-recommend-label { margin: 0 0 8px; color: var(--fl-plum); }
body.smp-florist .fl-recommendation h3 { margin: 0; font-family: var(--fl-serif); font-size: clamp(1.55rem, 2.2vw, 2.3rem); font-weight: 500; line-height: 1.5; }
body.smp-florist .fl-recommendation > p:not(.fl-recommend-label) { margin: 18px 0 0; }
body.smp-florist .fl-recommendation dl { margin: 24px 0 0; border-top: 1px solid var(--fl-line); border-bottom: 1px solid var(--fl-line); }
body.smp-florist .fl-recommendation dl div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; }
body.smp-florist .fl-recommendation dd { margin: 0; color: var(--fl-plum); font-weight: 700; white-space: nowrap; }
body.smp-florist .fl-recommendation .fl-note, body.smp-florist .fl-fiction { color: #666; font-size: .84rem; }
body.smp-florist .fl-bouquet { padding: 170px 0; }
body.smp-florist .fl-bouquet-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 85px; align-items: center; }
body.smp-florist .fl-bouquet-copy { padding-top: 100px; }
body.smp-florist .fl-bouquet-copy p:not(.fl-side-label) { max-width: 28em; }
body.smp-florist .fl-bouquet-grid img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
body.smp-florist .fl-order { background: var(--fl-pink); }
body.smp-florist .fl-order-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 100px; }
body.smp-florist .fl-order ol { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--fl-line); }
body.smp-florist .fl-order li { display: grid; grid-template-columns: 46px 1fr; gap: 20px; padding: 20px 0; border-bottom: 1px solid var(--fl-line); }
body.smp-florist .fl-order li span { color: var(--fl-plum); font-family: var(--fl-serif); font-size: 1.5rem; }
body.smp-florist .fl-order h3 { margin: 0 0 6px; font-size: 1.12rem; }
body.smp-florist .fl-order li p { margin: 0; }
body.smp-florist .fl-hours { padding: 130px 0; }
body.smp-florist .fl-hours-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 120px; }
body.smp-florist .fl-hours-grid > div:first-child p:last-child { max-width: 28em; }
body.smp-florist .fl-hours dl { margin: 0; border-top: 1px solid var(--fl-line); }
body.smp-florist .fl-hours dl div { display: grid; grid-template-columns: 120px 1fr; gap: 14px; padding: 15px 0; border-bottom: 1px solid var(--fl-line); }
body.smp-florist .fl-hours dt { color: var(--fl-plum); }
body.smp-florist .fl-hours dd { margin: 0; }
body.smp-florist .fl-hours .fl-note { color: #666; font-size: .86rem; }
body.smp-florist .fl-foot { padding: 70px 0; background: var(--fl-plum); color: #f5eaf0; font-size: .88rem; }
body.smp-florist .fl-foot-name { margin: 0; color: #fff; font-family: var(--fl-serif); font-size: 1.6rem; }
body.smp-florist .fl-foot-links { display: flex; flex-wrap: wrap; gap: 8px 30px; margin-top: 22px; }
body.smp-florist .fl-foot-links a { display: inline-flex; align-items: center; min-height: 44px; color: #fff; }
@media (max-width: 900px) {
body.smp-florist .fl-nav { gap: 12px; }
body.smp-florist .fl-hero { min-height: 580px; }
body.smp-florist .fl-hero-main { height: 500px; }
body.smp-florist .fl-intro-grid, body.smp-florist .fl-choice-heading, body.smp-florist .fl-choice-grid { gap: 35px; }
body.smp-florist .fl-bouquet-grid, body.smp-florist .fl-order-grid, body.smp-florist .fl-hours-grid { gap: 40px; }
}
@media (max-width: 650px) {
body.smp-florist .fl-wrap { width: min(100% - 36px, 1160px); }
body.smp-florist .fl-head-in { justify-content: center; min-height: 67px; }
body.smp-florist .fl-nav { display: none; }
body.smp-florist .fl-hero, body.smp-florist .fl-intro-grid, body.smp-florist .fl-choice-heading, body.smp-florist .fl-choice-grid, body.smp-florist .fl-bouquet-grid, body.smp-florist .fl-order-grid, body.smp-florist .fl-hours-grid { grid-template-columns: 1fr; }
body.smp-florist .fl-hero-text { padding: 70px 22px 40px; }
body.smp-florist .fl-hero h1 { font-size: clamp(2.5rem, 10vw, 3.6rem); }
body.smp-florist .fl-hero-images { padding-bottom: 78px; }
body.smp-florist .fl-hero-main { height: 330px; }
body.smp-florist .fl-hero-small { left: auto; right: 7%; bottom: 8px; width: 40%; height: 170px; border-width: 7px; }
body.smp-florist .fl-section, body.smp-florist .fl-intro, body.smp-florist .fl-bouquet, body.smp-florist .fl-hours { padding: 80px 0; }
body.smp-florist .fl-choice-heading { margin-bottom: 26px; }
body.smp-florist .fl-choice-grid { gap: 28px; }
body.smp-florist .fl-recommendation { min-height: 0; padding: 25px 20px; }
body.smp-florist .fl-recommendation dl div { flex-wrap: wrap; }
body.smp-florist .fl-bouquet-copy { padding-top: 0; }
body.smp-florist .fl-bouquet-grid img { aspect-ratio: 4/3; }
}
@media (prefers-reduced-motion: reduce) { body.smp-florist *, body.smp-florist *::before, body.smp-florist *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }
@media (max-width: 360px) { body.smp-florist .fl-hero h1 { font-size: 2rem; } body.smp-florist .fl-choice h2 { font-size: 1.5rem; letter-spacing: 0; } }