/* ===== Company（Figma 14511:47831）1440×815 / bg base3 / pt100 pb160 pr160 ===== */
.company{position:relative;overflow:hidden;background:var(--c-base3);padding:100px 0 var(--sp-section-gap)}
/* 装飾（Union）: left354.55 top54 1271.495×786.999 / SVG側で opacity.55 + overlay */
.company__deco{position:absolute;left:calc(50% - 365.45px);top:54px;width:1271.495px;height:786.999px;max-width:none;pointer-events:none}
/* 行の左端はビューポート左端に固定（あおさん指示 B-2: 写真をコンテナ幅に収めずフルブリード）。右側は従来どおり1440コンテナ基準 */
.company__row{position:relative;display:flex;align-items:center;gap:120px;width:auto;margin-left:0;margin-right:max(160px,calc((100% - 1440px) / 2 + 160px))}
/* 写真 703×555 右角丸5 / imgは Figma のクロップ値（left-6.73% w116.3%）を再現
   幅は「1440で703px」を基準に、1440超では左に伸びた分（(100vw-1440)/2）を足して画面左端まで届かせる。1440未満では flex-shrink で縮む */
.company__photo{position:relative;flex:0 1 auto;min-width:0;width:calc(703px + max(0px,(100vw - 1440px) / 2));height:555px;overflow:hidden;border-radius:0 var(--r-m) var(--r-m) 0;background:#fff}
.company__photo img{position:absolute;top:0;left:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%}  /* 2枚ともFigmaノード（703×555）の書き出し＝カンプと同じ切り抜き。箱が広がる幅(>1440)でも比率維持 */
/* 写真ループ（あおさん指示 2026-09-10）: 手前(.is-front)に来る写真を inset(0 100% 0 0)→inset(0) で左→右に開く。奥の写真はそのまま見せておく */
/* ループ切替は1.8秒のクロスフェード（「もっとふわっと」2026-09-15）。手前(is-front)が上に重なって現れ、奥(is-back)は不透明のまま下に残す＝途中で背景が透けない */
.company__img{opacity:0;z-index:1}
.company__img.is-front{opacity:1;z-index:2}
/* transition は animation.css の .js .js-reveal-mask img（transform 1.1s）より詳細度を上げて、出現時の寄り(transform)とループの opacity を両方持たせる */
.js .js-reveal-mask .company__img{transition:transform 1.1s var(--ease-out-quint,ease),opacity 1.8s var(--ease-in-out-quart,ease-in-out)}
.js .js-reveal-mask .company__img.is-back{opacity:1;z-index:1;transition:none}
/* テキスト 457 / gap56 → head(gap32) + button */
.company__text{display:flex;flex-direction:column;align-items:flex-start;gap:56px;flex:none;width:457px}
.company__head{display:flex;flex-direction:column;gap:32px;width:100%}
.company__title{font-size:var(--fs-concept);font-weight:500;line-height:1.6;letter-spacing:1.44px}
.company__body{display:flex;flex-direction:column;gap:16px;width:100%;font-size:var(--fs-body-m);font-weight:400;line-height:2;letter-spacing:.16px}
.company__body-block{white-space:nowrap}

/* ===== SP（768px以下）: Company（Figma 14600:69375）375×861 / pt64 pb80 / テキスト→写真の縦積み ===== */
@media (max-width:768px){
  .company{padding:64px 0 var(--sp-section-gap)}
  /* 装飾 Union（SP形状）: left-28 top136 460.001×283.999 */
  .company__deco{left:-28px;top:136px;width:460.001px;height:283.999px}
  .company__row{flex-direction:column;align-items:flex-start;gap:80px;width:100%;margin:0}
  /* テキスト: pl24 pr36 / gap40（head gap32 → button） */
  .company__text{order:1;width:100%;padding:0 36px 0 var(--sp-side-m);gap:var(--sp-under-btn)}
  .company__title{letter-spacing:1.12px}
  .company__body{letter-spacing:.15px}
  .company__body-block{white-space:normal}
  .company__br-pc{display:none}
  /* SPボタン: 199×56 / gap24 / pl20 pr12 py10 / ラベル中央 */
  .company .btn{width:199px;max-width:299px;gap:24px;padding:10px 12px 10px 20px}
  .company .btn__label{flex:1 0 0;min-width:0}
  /* 写真: pl24 / 351×253 / 左角丸5 / Figma object-cover（3:2 → 1.387、左右を等分トリミング） */
  .company__photo{order:2;flex:none;width:calc(100% - var(--sp-side-m));height:253px;margin-left:var(--sp-side-m);border-radius:var(--r-m) 0 0 var(--r-m)}
  .company__photo img{left:0;width:100%;object-fit:cover;object-position:center}
}

/* ===== 1440px未満（769〜1439px）: 写真が縮む帯域では高さ固定をやめ、703:555 の比率で追従させて中身は cover（縦伸び防止） =====
   1440ちょうどは従来の Figma クロップ値のまま（画素一致を保つ）。cover の基準位置は Figma クロップ（左6.7%寄り）と同じ見え方になる 41% */
@media (min-width:769px) and (max-width:1439px){
  .company__photo{height:auto;aspect-ratio:703/555}
  .company__photo img{left:0;width:100%;object-fit:cover;object-position:41% 50%}
}

/* ===== タブレット（769〜1200px）: 右余白30px・写真とテキストを比率で分け合う（カンプ未支給） ===== */
@media (min-width:769px) and (max-width:1200px){
  .company__deco{display:none}
  .company__row{gap:60px;margin-right:var(--pad-side)}
  .company__text{flex:0 1 457px;min-width:300px;width:auto}
  .company__body-block{white-space:normal}
  .company__br-pc{display:none}
}
