/* ===== about page ===== */

/* STORY */
.story{position:relative;overflow:hidden;text-align:center;padding-top:72px}
.story>*{position:relative;z-index:1}
.story__lead{font-size:26px;font-weight:700;line-height:1.7;margin:14px 0 34px}
.story__body{max-width:780px;margin:0 auto;font-size:13.5px;color:#4a4a4a;line-height:2.15}
.story__body+.story__body{margin-top:26px}

/* PROMISE */
.promise{position:relative;overflow:hidden}
.promise::before{
  content:"";position:absolute;left:-12%;top:8%;width:520px;height:520px;
  background:url("../images/blob.png") no-repeat center/contain;
  mix-blend-mode:multiply;filter:blur(52px);opacity:.4;z-index:0;pointer-events:none;
}
.promise__inner{position:relative;z-index:1;display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}
.promise__desc{font-size:13px;color:#555;line-height:2;margin-top:6px;max-width:280px}
.promise__icons{display:flex;gap:26px;margin-top:40px}
.promise__icons svg{width:28px;height:28px;stroke:#b3afa4;fill:none;stroke-width:1.3}
.promise__list{display:flex;flex-direction:column;gap:30px}
.pitem{display:grid;grid-template-columns:34px 1fr;gap:24px;align-items:start}
.pitem__no{
  font-family:var(--latin);font-size:22px;color:#1b1b1b;line-height:1.2;
  padding-right:8px;border-right:1px solid #a8a49b;
}
.pitem__title{font-size:16px;font-weight:700;line-height:1.6;margin-bottom:8px}
.pitem__desc{font-size:12.5px;color:#6a6a6a;line-height:1.9}

/* VISION */
.vision{position:relative;overflow:hidden;text-align:center}
.vision::before{
  content:"";position:absolute;left:-12%;top:8%;width:520px;height:520px;
  background:url("../images/blob.png") no-repeat center/contain;
  mix-blend-mode:multiply;filter:blur(52px);opacity:.4;z-index:0;pointer-events:none;
}
.vision::after{
  content:"";position:absolute;right:-10%;bottom:-10%;width:520px;height:520px;
  background:url("../images/blob.png") no-repeat center/contain;
  mix-blend-mode:multiply;filter:blur(52px);opacity:.4;z-index:0;pointer-events:none;
}
.vision>*{position:relative;z-index:1}
.vision__lead{font-size:26px;font-weight:700;margin:16px 0 26px}
.vision__body{max-width:760px;margin:0 auto;font-size:13.5px;color:#4a4a4a;line-height:2.1}

/* SERVICE (about layout) */
.asvc__inner{display:grid;grid-template-columns:340px 1fr;gap:50px;align-items:stretch}
.asvc__photo{border-radius:4px;overflow:hidden;min-height:640px}
.asvc__photo img{width:100%;height:100%;object-fit:cover}
.asvc__list{display:flex;flex-direction:column}
.asvc__row{
  display:grid;grid-template-columns:130px 1fr;gap:26px;align-items:center;
  padding:24px 0;border-bottom:1px solid #e4e2dc;
}
.asvc__row:first-child{padding-top:0}
.asvc__thumb{aspect-ratio:1/1;border-radius:4px;overflow:hidden;background:#e7e4de}
.asvc__thumb img{width:100%;height:100%;object-fit:cover}
.asvc__title{font-size:16px;font-weight:700;margin-bottom:10px}
.asvc__desc{font-size:12.5px;color:#5a5a5a;line-height:1.9;margin-bottom:16px}

@media(max-width:900px){
  .promise__inner{grid-template-columns:1fr;gap:36px}
  .asvc__inner{grid-template-columns:1fr}
  .asvc__photo{min-height:320px}
  .asvc__row{grid-template-columns:96px 1fr;gap:18px}
}

/* ===== mobile (SP comp: sp/about.png) ===== */
@media(max-width:820px){
  .story{padding-top:46px}
  .story__lead{font-size:20px;margin:10px 0 22px;padding-left:20px;padding-right:20px}
  .story__body{font-size:13px;line-height:2.0;padding-left:20px;padding-right:20px}
  .story__body+.story__body{margin-top:20px}

  .promise__inner{gap:30px}
  .promise__desc{max-width:none}
  .promise__icons{gap:20px;margin-top:26px}
  .promise__icons svg{width:24px;height:24px}
  .promise__list{gap:24px}
  .pitem{grid-template-columns:26px 1fr;gap:18px}
  .pitem__no{font-size:20px;padding-right:6px}

  .vision__lead{font-size:20px;margin:12px 0 20px;padding-left:20px;padding-right:20px}
  .vision__body{font-size:13px;padding-left:20px;padding-right:20px}

  /* SERVICE: big photo on top, rows stack (photo over text) */
  .asvc__inner{gap:0}
  .asvc__photo{min-height:0;height:auto;aspect-ratio:16/11;margin-bottom:26px}
  .asvc__row{grid-template-columns:1fr;gap:14px;padding:22px 0}
  .asvc__thumb{aspect-ratio:16/10}
  .asvc__desc{margin-bottom:12px}
}