@charset "UTF-8";
/* FREESTYLE original e-commerce business page — scoped images/layout update */
.ec-biz-hero { background:linear-gradient(118deg,#ffffff 0%,#f4fbff 43%,#d9efff 100%); }
.ec-biz-hero .d-hero-grid { grid-template-columns:47% 53%;gap:22px;padding-top:43px; }
.ec-biz-hero-visual { margin:0 10px 0 0; min-width:0; }
.ec-biz-devices { isolation:isolate;position:relative;min-height:440px;display:flex;align-items:center;justify-content:flex-end; }
.ec-biz-orbit { position:absolute;border-radius:50%;z-index:-1;pointer-events:none; }
.ec-biz-orbit-one {width:450px;height:450px;right:0;top:5px;background:radial-gradient(circle,#fff 4%,#a6dafe 67%,#a6dafe00 75%);opacity:.65}
.ec-biz-orbit-two {width:280px;height:280px;left:-20px;bottom:-60px;background:radial-gradient(circle,#dbf2ff,#dbf2ff00 72%)}
.ec-biz-laptop {width:85%;margin-right:0;border:8px solid #15283d;border-bottom:0;border-radius:18px 18px 0 0;box-shadow:0 23px 45px rgba(8,55,105,.2);background:#fff;transform:rotate(-1.5deg);overflow:visible;position:relative;}
.ec-biz-device-top {height:22px;background:#f6f8fb;display:flex;align-items:center;gap:5px;padding:0 10px;border-radius:10px 10px 0 0}
.ec-biz-device-top>span,.ec-biz-dots i{height:6px;width:6px;border-radius:100%;background:#b9ccdf}
.ec-biz-device-top small {font:700 8px Arial,sans-serif;color:#7e91a5;letter-spacing:.2em;margin:auto}
.ec-biz-laptop>img {display:block;width:100%;aspect-ratio:16/9;object-fit:cover;object-position:top;background:#fff}
.ec-biz-laptop-foot {position:absolute;top:100%;left:-5%;right:-5%;height:13px;background:linear-gradient(#e7eaf0,#aab7c3);border-radius:1px 1px 16px 16px;box-shadow:0 4px 7px #37527122}
.ec-biz-phone {position:absolute;left:0;bottom:38px;width:33%;height:260px;background:#121e2b;border:6px solid #121e2b;border-radius:22px;box-shadow:0 18px 30px #0d426a46;overflow:hidden;transform:rotate(4deg);z-index:2;}
.ec-biz-phone-earpiece {position:absolute;top:2px;left:33%;width:34%;height:8px;background:#121e2b;border-radius:0 0 8px 8px;z-index:2}
.ec-biz-phone img {width:100%;height:100%;object-fit:cover;object-position:top}
.ec-biz-bubble {position:absolute;top:10px;left:0;z-index:3;display:flex;gap:10px;align-items:center;padding:12px 16px;background:#fff;border-radius:12px;box-shadow:0 12px 26px rgba(12,69,120,.16);color:#587893;font-size:10px;line-height:1.45;letter-spacing:.07em}
.ec-biz-bubble strong{color:#113e72;font-size:12px}.ec-biz-star{font-size:22px;color:#1685e7}
.ec-biz-hero-caption {position:absolute;bottom:-12px;right:0;color:#607c94;font-size:10px;margin:0;text-align:right}
.d-page .ec-biz-shop-media {min-height:385px;padding:23px;overflow:hidden;position:relative;}
.ec-biz-shop-media.d-takumi{background:radial-gradient(circle at 70% 15%,#4f4536 0%,#10100f 70%)}
.ec-biz-shop-media.d-orivela{background:linear-gradient(133deg,#fffaf4,#e7dcd0)}
.ec-biz-shot-wrap {position:relative;width:100%;max-width:520px;}
.ec-biz-shot-browser {width:100%;background:#fff;border:7px solid #f8fbff;border-radius:13px;box-shadow:0 24px 36px #1118273d;overflow:hidden;transform:rotate(-1.4deg);}
.ec-biz-shop-media.d-orivela .ec-biz-shot-browser {transform:rotate(1.4deg)}
.ec-biz-browser-toolbar{height:23px;background:#edf3f9;display:flex;align-items:center;gap:7px;padding:0 12px}
.ec-biz-dots{display:flex;gap:4px}.ec-biz-dots i{width:6px;height:6px;background:#bdc8d4}
.ec-biz-browser-label {margin:auto;color:#7c8999;font-size:8px;letter-spacing:.2em;font-weight:900}
.d-page .ec-biz-shop-media img {width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:top;border-radius:0}
.ec-biz-shot-tag{position:absolute;bottom:-15px;right:-10px;background:#fff;color:#0f528f;border-radius:9px;box-shadow:0 6px 20px #161e2c35;padding:10px 13px;font-size:11px;font-weight:900}
.ec-biz-visual-note{display:block;margin-top:12px;font-size:11px;line-height:1.7;color:#6d849b}
.d-page .ec-biz-yahoo-media {background:linear-gradient(122deg,#e7f7ff,#c9eafa)}
.d-page .ec-biz-yahoo-media img{max-height:305px;object-fit:contain}
.d-page .d-shop-big {box-shadow:0 20px 36px rgba(15,64,112,.10)}
@media (max-width:1000px) {
 .ec-biz-hero .d-hero-grid{grid-template-columns:49% 51%;gap:10px}
 .ec-biz-devices{min-height:350px}
 .ec-biz-phone{height:210px}
}
@media (max-width:760px) {
 .ec-biz-hero .d-hero-grid{grid-template-columns:1fr;gap:20px}
 .ec-biz-hero-visual{margin:0 4px 18px}
 .ec-biz-devices{min-height:325px;max-width:500px;margin-inline:auto}
 .ec-biz-laptop{width:82%}
 .ec-biz-phone{width:29%;height:205px;bottom:25px}
 .ec-biz-bubble{top:2px;left:0}
 .ec-biz-hero-caption{bottom:-19px;right:12px}
 .d-page .ec-biz-shop-media{min-height:270px;padding:20px 26px}
 .ec-biz-shot-wrap{max-width:480px}
}
@media (max-width:440px) {
 .ec-biz-devices{min-height:285px}
 .ec-biz-phone{height:180px;left:0;bottom:16px}
 .ec-biz-laptop{width:84%;margin-right:0}
 .ec-biz-bubble{top:0;padding:9px 12px;font-size:9px}
 .ec-biz-bubble strong{font-size:10px}
 .d-page .ec-biz-shop-media{min-height:230px;padding:19px 20px}
 .ec-biz-shot-tag{font-size:9px}
}
@media(prefers-reduced-motion:reduce){.ec-biz-laptop,.ec-biz-phone,.ec-biz-shot-browser{transform:none}}


/* v2: images fit fully inside their responsive areas; no change to copy/buttons. */
/* The previous percentage columns added up to 100% *before* the gap,
   so the right column could extend beyond the viewport and be clipped. */
.ec-biz-hero .d-hero-grid {
  grid-template-columns:minmax(0,47fr) minmax(0,53fr);
  gap:clamp(12px,1.7vw,22px);
}
.ec-biz-hero .d-hero-text,
.ec-biz-hero .d-hero-media { min-width:0; }
.ec-biz-hero-visual { width:auto; max-width:100%; margin-right:0; }
.ec-biz-devices { width:100%; max-width:100%; min-width:0; }
/* The lower-right editorial image should never be cropped; preserve its
   original aspect ratio and let the panel grow to fit it. */
.ec-biz-bottom-panel { min-width:0; height:auto; overflow:hidden; }
.d-page .ec-biz-bottom-panel > .ec-biz-bottom-photo {
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  max-height:none;
  aspect-ratio:auto;
  object-fit:contain;
  object-position:center;
}
@media (min-width:761px) and (max-width:1000px) {
  .ec-biz-hero .d-hero-grid { grid-template-columns:minmax(0,49fr) minmax(0,51fr); }
}
@media (max-width:760px) {
  .ec-biz-hero .d-hero-grid { grid-template-columns:minmax(0,1fr); }
  .ec-biz-hero-visual { margin:0 4px 18px; }
}


/* === FREESTYLE Self-Operated EC | 2026-10-24: shop card alignment & no labels ===
   Scoped to this EC business page's shop section.
   Preserves all user-provided images and existing link/copy.
*/
.d-page .d-shops {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(18px,2.4vw,28px);
  min-width:0;
  max-width:100%;
}
.d-page .d-shops > .d-shop-big {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  grid-template-rows:auto;
  direction:ltr !important;
  align-items:stretch;
  min-width:0;
  width:100%;
  max-width:100%;
  overflow:hidden;
  border-radius:20px;
  box-sizing:border-box;
}
/* Alternate visual side without RTL direction, which causes intrinsic overflow. */
.d-page .d-shops > .d-shop-big:nth-child(even) > .d-shop-photo {
  grid-column:2;grid-row:1;
}
.d-page .d-shops > .d-shop-big:nth-child(even) > .d-shop-body {
  grid-column:1;grid-row:1;
}
.d-page .d-shops .d-shop-photo,
.d-page .d-shops .d-shop-body {
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
  direction:ltr !important;
}
.d-page .d-shops .d-shop-body {
  padding:clamp(24px,3.2vw,43px);
  justify-content:center;
  align-items:flex-start;
  overflow-wrap:anywhere;
}
.d-page .d-shops .d-shop-body h3 {line-height:1.32;max-width:100%;}
.d-page .d-shops .d-shop-body p {max-width:100%;}
.d-page .d-shops .ec-biz-shop-media {
  padding:clamp(16px,2.4vw,29px);
  min-height:320px;
  height:auto;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.d-page .d-shops .ec-biz-shot-wrap {
  width:100%;
  max-width:560px;
  min-width:0;
  position:relative;
}
.d-page .d-shops .ec-biz-shot-browser,
.d-page .d-shops .ec-biz-shop-media.d-orivela .ec-biz-shot-browser {
  transform:none !important;
  box-sizing:border-box;
  width:100%;
  overflow:hidden;
  border:clamp(4px,.7vw,7px) solid rgba(255,255,255,.98);
  border-radius:13px;
  box-shadow:0 12px 28px rgba(12,53,92,.20);
}
.d-page .d-shops .ec-biz-shop-media img {
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  aspect-ratio:auto;
  object-fit:contain;
  object-position:center;
  border-radius:0;
}
/* The overlapping picture tags, plus fake browser-top label, are removed. */
.d-page .d-shops .ec-biz-shot-tag,
.d-page .d-shops .ec-biz-browser-toolbar {
  display:none !important;
}
@media (max-width:760px) {
  .d-page .d-shops > .d-shop-big {
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto;
  }
  .d-page .d-shops > .d-shop-big > .d-shop-photo,
  .d-page .d-shops > .d-shop-big:nth-child(even) > .d-shop-photo {
    grid-column:1;grid-row:1;
  }
  .d-page .d-shops > .d-shop-big > .d-shop-body,
  .d-page .d-shops > .d-shop-big:nth-child(even) > .d-shop-body {
    grid-column:1;grid-row:2;
  }
  .d-page .d-shops .ec-biz-shop-media {
    min-height:0;
    padding:18px;
  }
  .d-page .d-shops .ec-biz-shot-wrap {max-width:520px;}
  .d-page .d-shops .d-shop-body {padding:24px 23px 28px;}
}
@media (max-width:380px) {
  .d-page .d-shops .ec-biz-shop-media {padding:13px;}
  .d-page .d-shops .d-shop-body {padding:21px 18px 25px;}
}