:root { color-scheme:light; --ink:#365756; --body:#3f5454; --muted:#506868; --pale:#eaf2f5; --line:#cedbdd; --serif:"BIZ UDPMincho","Yu Mincho","YuMincho","Hiragino Mincho ProN",serif; --sans:"BIZ UDPGothic","Yu Gothic","YuGothic","Hiragino Kaku Gothic ProN","Meiryo",sans-serif; }
* { box-sizing:border-box; }
body { margin:0;background:#fff;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased; }
p,h1,figure { margin:0; }
.sample-note { min-height:32px;padding:7px 16px;text-align:center;font-size:12px;line-height:1.5;color:var(--muted);background:var(--pale);letter-spacing:.03em; }
.first-view { max-width:1600px;margin:auto; }
.header { margin:auto;width:87.5%;min-height:82px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px; }
.wordmark { display:flex;flex-direction:column;align-items:center;gap:3px; }
.notice { font:400 29px/1.15 Georgia,"Times New Roman",serif;letter-spacing:.07em; }
.flower { font:400 12px/1.2 Georgia,"Times New Roman",serif;letter-spacing:.21em; }
.header-place,.header-location { font-size:13px;line-height:1.6;letter-spacing:.04em;color:var(--muted); }
.header-location { text-align:right;font-family:Georgia,"Times New Roman",serif;letter-spacing:.12em; }
.visual { position:relative;margin:0 3.125%; }
.photo-placeholder { height:290px;display:flex;align-items:center;justify-content:center;background:#dbe6e6;border-radius:40px 0 0 0;overflow:hidden;clip-path:polygon(0 0,100% 0,100% 82%,0 100%); }
.flower-photo { display:block;width:100%;height:100%;object-fit:cover;object-position:50% 44%; }
.placeholder-label { padding:24px 24px 46px;display:flex;flex-direction:column;align-items:center;gap:11px;color:#476462; }
.placeholder-en { font:400 19px/1.5 Georgia,"Times New Roman",serif;letter-spacing:.12em; }
.placeholder-ja { font-size:16px;line-height:1.6; }
.placeholder-meta { font-size:12px;line-height:1.6; }
figcaption { position:absolute;right:18px;bottom:7px;padding:1px 4px;background:#fff;font-size:12px;line-height:1.5;letter-spacing:0;color:var(--muted); }
.intro { padding:10px 24px 25px;text-align:center; }
.eyebrow { font:400 17px/1.5 "Times New Roman",Georgia,serif;letter-spacing:.045em;color:#476563; }
h1 { margin-top:12px;font-family:var(--serif);font-size:34px;line-height:1.7;letter-spacing:.085em;font-weight:400; }
h1>span { display:inline-block;white-space:nowrap; }
.consultation { width:87.5%;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:36px;padding:23px 5%;background:var(--pale); }
.description { font-size:16px;line-height:1.9;color:var(--body);letter-spacing:.025em; }
.description>span { display:block; }
.actions { flex-shrink:0; }
.consult { display:flex;align-items:center;justify-content:space-between;width:310px;min-height:60px;gap:28px;padding:15px 24px;border:1px solid #729697;background:#fff;border-radius:0;color:var(--ink);font:500 17px/1.6 var(--sans);letter-spacing:.03em;opacity:1;cursor:default; }
.arrow { font:400 25px/1 Arial,sans-serif; }
.action-note { margin-top:8px;color:var(--muted);font-size:12px;line-height:1.6;text-align:center; }
.hero-footer { width:87.5%;margin:auto;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0 24px;font-size:13px;line-height:1.6;color:var(--muted); }
.offerings { display:flex;align-items:center;gap:10px;flex-wrap:wrap; }
.offerings>span { font-size:12px;color:#789091; }
.address { font-size:12px;white-space:nowrap; }
@media (min-width:1450px) and (min-height:800px) { .photo-placeholder {height:350px;} .header {min-height:94px;} .intro {padding-top:20px;padding-bottom:32px;} }
@media (min-width:761px) and (max-height:760px) { .header {min-height:76px;} .photo-placeholder {height:270px;} .intro {padding-top:8px;padding-bottom:22px;} h1 {font-size:32px;margin-top:10px;} .consultation {padding-top:20px;padding-bottom:20px;} }
@media (min-width:761px) and (max-width:1050px) { .consultation {gap:20px;padding-left:3%;padding-right:3%;} .consult {width:290px;} .description {letter-spacing:0;} .hero-footer {font-size:12px;} .offerings {gap:6px;} }
@media (max-width:760px) {
  .sample-note {padding:7px 10px;letter-spacing:0;}
  .header {width:calc(100% - 40px);min-height:74px;grid-template-columns:1fr auto;gap:16px;}
  .wordmark {grid-column:1;grid-row:1;align-items:flex-start;}
  .notice {font-size:27px;}
  .flower {font-size:12px;}
  .header-place {grid-column:2;grid-row:1;font-size:12px;}
  .header-location {display:none;}
  .visual {margin:0 12px;}
  .photo-placeholder {height:210px;border-radius:28px 0 0 0;clip-path:polygon(0 0,100% 0,100% 86%,0 100%);}
  .flower-photo {object-position:50% 46%;}
  .placeholder-label {padding:20px 18px 36px;gap:9px;}
  .placeholder-en {font-size:16px;}
  .placeholder-ja {font-size:15px;}
  figcaption {right:9px;bottom:0;font-size:12px;letter-spacing:0;}
  .intro {padding:17px 20px 24px;}
  .eyebrow {font-size:16px;}
  h1 {font-size:30px;line-height:1.6;letter-spacing:.045em;margin-top:12px;}
  h1>span {display:block;}
  .consultation {width:calc(100% - 40px);flex-direction:column;gap:20px;padding:23px 20px 19px;align-items:stretch;}
  .description {font-size:16px;line-height:1.9;letter-spacing:0;text-align:center;}
  .description>span {display:inline;}
  .description>span:last-child {display:block;margin-top:7px;}
  .consult {width:100%;min-height:60px;font-size:16px;padding:15px 17px;gap:16px;}
  .action-note {margin-top:8px;font-size:12px;letter-spacing:0;}
  .hero-footer {width:calc(100% - 40px);flex-direction:column;align-items:center;gap:9px;padding:20px 0 22px;}
  .offerings {font-size:12px;gap:6px;justify-content:center;}
  .address {font-size:12px;}
}
@media (max-width:370px) { .consultation {padding-left:15px;padding-right:15px;} h1 {font-size:28px;} .offerings {gap:4px;} }