/* 花印 HANAJIRUSHI — premium v1.6: the client's feedback of 2026-10-14 (20261014 フィードバック).
   Loaded after premium-v15.css on every v1.6 page.
   - home: the cleansing-oil slide shows the client's banner (image 1) in full colour; on phones and
     tablets the banner is a picture above the text, cropped to the product
   - company: the closing slogan of the message is larger and stronger; the office photos are a
     balanced grid (three 4:5 above three 16:9) with the new lab photos */

/* ---- home: the cleansing-oil slide */
.hs13--oil .hs13__bg img{filter:none}
.hs13--oil .hs13__bg::after{background:linear-gradient(90deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.78) 30%,rgba(255,255,255,0) 56%)}
.hs13__pn{display:block;margin-bottom:6px;font-weight:500;color:var(--ink);letter-spacing:.08em}
.hs13__banner{display:none}
@media (max-width:1024px){
  .hs13--oil .hs13__bg{display:none}
  .hs13__banner{display:block;width:100%;aspect-ratio:4/3;overflow:hidden;box-shadow:0 20px 40px -28px rgba(39,38,40,.45)}
  .hs13__banner img{width:100%;height:100%;object-fit:cover;object-position:66% center}
}

/* ---- company: the closing slogan of the message, easier to read */
.msg__end{font-size:clamp(18px,1.7vw,22px)!important;font-weight:600;letter-spacing:.16em;line-height:1.8;color:var(--beni-d)}

/* ---- company: office photos, three portrait above three wide */
.ofc16{display:grid;gap:clamp(20px,2.4vw,32px);margin-top:clamp(48px,5vw,72px)}
.ofc16 ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.ofc16 img{width:100%;object-fit:cover;filter:saturate(.92)}
.ofc16__p img{aspect-ratio:4/5}
.ofc16__w img{aspect-ratio:16/9}
@media (max-width:760px){
  .ofc16 ul{gap:8px}
  .ofc16 figcaption{font-size:10.5px;letter-spacing:.06em}
  .ofc16__w{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ofc16__w li:last-child{grid-column:1/-1}
}

/* ---- contact (mockup only, premium-v16-form.js): the 確認 and 完了 screens, as on the WordPress
   site, and a preview of the two emails it sends */
.mk-note{margin-top:8px;font-size:12.5px;color:var(--ink-3)}
.mk-step .cfm{margin-top:20px}
.mk-step .cfm dd{white-space:normal;overflow-wrap:anywhere}
.mk-step .cfm__b{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.pform--done.mk-step p+p{margin-top:12px}
.pform--done.mk-step .pform__h{font-size:18px}
.mk-mail{margin-top:clamp(40px,5vw,64px)}
.mk-mail__h{text-align:center;font-family:var(--mincho);font-weight:500;font-size:19px;letter-spacing:.12em}
html[lang="en"] .mk-mail__h{font-family:var(--didone);font-weight:400;font-size:24px;letter-spacing:0}
.mk-mail__n{margin-top:8px;text-align:center;font-size:12px;color:var(--ink-3)}
.mk-mail__g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,28px);margin-top:24px}
.mk-mail__c{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px -30px rgba(39,38,40,.45)}
.mk-mail__t{display:block;padding:10px 16px;background:var(--plum);color:#fff;font-size:12.5px;font-weight:500;letter-spacing:.12em}
.mk-mail__c dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;padding:14px 16px 0;font-size:12.5px;line-height:1.6}
.mk-mail__c dt{color:var(--ink-3);white-space:nowrap}
.mk-mail__c dd{overflow-wrap:anywhere}
.mk-mail__c pre{flex:1;margin:14px 16px 0;padding:14px 16px;background:var(--paper-2);font:12.5px/1.85 var(--gothic);white-space:pre-wrap;overflow-wrap:anywhere;max-height:460px;overflow:auto}
.mk-mail__f{padding:10px 16px 14px;font-size:11.5px;color:var(--ink-3)}
@media (max-width:760px){.mk-mail__g{grid-template-columns:1fr}}