@charset "UTF-8";

/* =====================================================
   さくらほりきりが初めての方へ（まずはこちら）LP
   構成案PDF（まずはこちらP_構成案）を再現
   ※写真・アイコンは .lp-ph プレースホルダー（実画像に差し替え）
===================================================== */
#beginner-guide {
  /* ---- ブランドカラー（ピンク基調） ---- */
  --hj-pink: #e5396b;
  /* メインのホットピンク（線・見出しアクセント） */
  --hj-pink-d: #c9185b;
  /* 濃いピンク（番号・強調） */
  --hj-salmon: #f5a1a9;
  /* サーモン（アイコン塗り・ハート） */
  --hj-salmon-l: #fbc9ce;
  /* 薄いサーモン */
  --hj-bg: #fff4f6;
  /* セクション背景（淡ピンク） */
  --hj-bg2: #fbf6f2;
  /* 生成り背景 */
  --hj-cream: #fdf9f1;
  --hj-ink: #3a3230;
  /* 見出し */
  --hj-text: #4a4340;
  /* 本文 */
  --hj-sub: #8a8079;
  /* 補足 */
  --hj-line: #f0d2d8;
  /* 枠線（ピンク系） */
  --hj-white: #ffffff;
  --hj-width: 956px;
  --hj-narrow: 720px;
  --hj-pad: 24px;
  color: var(--hj-text);
  background: var(--hj-white);
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: .03em;
  -webkit-font-smoothing: antialiased;
}

#beginner-guide *,
#beginner-guide *::before,
#beginner-guide *::after {
  box-sizing: border-box;
}

#beginner-guide img {
  display: block;
  max-width: 100%;
  height: auto;
}

#beginner-guide a {
  color: inherit;
  text-decoration: none;
}

#beginner-guide p {
  margin: 0 0 1em;
}

#beginner-guide p:last-child {
  margin-bottom: 0;
}

/* =====================================================
   00. レイアウト共通
===================================================== */
/* PC・共通 */

#beginner-guide > section {
  margin-bottom: 0;
}

#beginner-guide .hj-inner {
  max-width: var(--hj-width);
  margin: 0 auto;
  padding: 0 var(--hj-pad);
}

#beginner-guide .hj-inner--narrow {
  max-width: var(--hj-narrow);
}

#beginner-guide .hj-sect {
  padding: 64px 0;
}

#beginner-guide .hj-sect--pink {
  background: var(--hj-bg);
}

#beginner-guide .hj-sect--cream {
  background: var(--hj-bg2);
}

#beginner-guide .hj-sect--white {
  background: #fff;
}

#beginner-guide .hj-sect--flush-b {
  padding-bottom: 0;
}

#beginner-guide .hj-sect--flush-t {
  padding-top: 20px;
}

/* 見出し（英字マーク＋和文） */
#beginner-guide .hj-mark {
  text-align: center;
  color: var(--hj-pink);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .18em;
  text-transform: uppercase;
  margin: 0 0 10px;
}

#beginner-guide .hj-h2 {
  margin: 0;
  text-align: center;
  color: var(--hj-ink);
  font-weight: 900;
  font-size: clamp(24px, 5vw, 32px);
  line-height: 1.4;
  letter-spacing: .04em;
}

#beginner-guide .hj-h2 .en {
  display: block;
  color: var(--hj-pink);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .16em;
  margin-top: 8px;
}

#beginner-guide .hj-lead {
  margin: 20px auto 0;
  max-width: 640px;
  text-align: center;
  color: var(--hj-text);
  font-size: 16px;
  line-height: 1.8;
}

/* SP */
@media screen and (max-width: 640px) {
  #beginner-guide .hj-sect {
    padding: 46px 0;
  }
}

/* =====================================================
   00. プレースホルダー
===================================================== */
/* PC・共通 */
#beginner-guide .lp-ph {
  position: relative;
  background: repeating-linear-gradient(45deg,
      #fbe7ea, #fbe7ea 11px, #f6d5db 11px, #f6d5db 22px);
  border: 1px solid #f0c9d1;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #c67a8c;
  font-size: 11px;
  line-height: 1.5;
  overflow: hidden;
  min-height: 60px;
}

#beginner-guide .lp-ph__label {
  background: rgba(255, 255, 255, .85);
  padding: 4px 10px;
  border-radius: 5px;
  border: 1px dashed #e2a6b3;
  max-width: 88%;
}

#beginner-guide .lp-ph--circle {
  border-radius: 50%;
  aspect-ratio: 1/1;
}

/* =====================================================
   01. ファーストビュー
===================================================== */
/* PC・共通 */
#beginner-guide .hj-hero {
  width: 100%;
  background: linear-gradient(180deg, #fff, #fbf6f2);
  overflow: hidden;
}

#beginner-guide .hj-hero__top,
#beginner-guide .hj-hero__photo,
#beginner-guide .hj-hero__btm {
  max-width: var(--hj-width);
  margin-left: auto;
  margin-right: auto;
}

#beginner-guide .hj-hero__top {
  padding: 56px 24px 32px;
  text-align: center;
}

#beginner-guide .hj-hero__btm {
  padding: 32px 24px 48px;
  text-align: center;
}

#beginner-guide .hj-hero__title {
  margin: 0;
  color: var(--hj-ink);
  font-weight: 600;
  font-size: clamp(28px, 5.6vw, 46px);
  line-height: 1.4;
  letter-spacing: .05em;
}

#beginner-guide .hj-hero__title b {
  font-weight: 900;
  font-size:1.15em;
}

#beginner-guide .hj-hero__name {
  margin: 18px 0 0;
  font-weight: 800;
  font-size: clamp(21px, 3.8vw, 26px);
  letter-spacing: .06em;
}

#beginner-guide .hj-hero__desc {
  margin: 20px 0 0;
  color: var(--hj-text);
  font-size: 16px;
  line-height: 1.8;
  font-weight: 500;
}

#beginner-guide .hj-hero__photo {
  display: block;
  width: 100%;
  border: none;
  border-radius: 0;
  overflow: hidden;
}

#beginner-guide .hj-hero__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#beginner-guide .hj-hero__btm .hj-hero__name {
  margin-top: 0;
}

#beginner-guide .hj-cta {
  text-align: center;
  margin-top: 34px;
}

#beginner-guide .hj-cta__btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(#f76a92, var(--hj-pink));
  color: #fff;
  font-weight: 800;
  font-size: clamp(20px, 4vw, 22px);
  line-height: 1.6;
  padding: 18px 46px;
  border-radius: 999px;
  box-shadow: 0 6px 0 #b3164f, 0 10px 20px rgba(201, 24, 91, .2);
  letter-spacing: .04em;
}

#beginner-guide .hj-cta__btn::after {
  content: "≫";
  font-size: 14px;
  opacity: .9;
}

#beginner-guide .hj-cta__btn:hover {
  transform: translateY(2px);
  box-shadow: 0 4px 0 #b3164f, 0 8px 16px rgba(201, 24, 91, .2);
}

/* SP */
@media screen and (max-width: 640px) {
  #beginner-guide .hj-hero__photo {
    aspect-ratio: auto;
    min-height: 0;
  }
}

/* =====================================================
   02. ミッション文
===================================================== */
/* PC・共通 */
#beginner-guide .hj-mission {
  text-align: center;
  padding: 8px 0;
}

#beginner-guide .hj-mission__title {
  margin: 0 0 32px;
  color: var(--hj-ink);
  font-weight: 900;
  font-size: clamp(26px, 5.4vw, 38px);
  line-height: 1.5;
  letter-spacing: .05em;
}

#beginner-guide .hj-mission p {
  margin: 0 0 1.7em;
  color: var(--hj-text);
  font-size: clamp(15px, 3.6vw, 16.5px);
  line-height: 2.1;
}

#beginner-guide .hj-mission p:last-child {
  margin-bottom: 0;
}

#beginner-guide .hj-mission__visual {
  display: block;
  max-width: 620px;
  margin: 36px auto;
}

#beginner-guide .hj-mission__visual img {
  display: block;
  width: 100%;
  height: auto;
}

/* SP */
@media screen and (max-width: 640px) {
  #beginner-guide .hj-mission__visual {
    margin: 36px auto 0;
  }
}

/* =====================================================
   03. ようこそ、さくらほりきりの世界へ
===================================================== */
/* PC・共通 */
#beginner-guide .hj-intro {
  text-align: center;
}

#beginner-guide .hj-intro__lead {
  margin: 0 auto;
  max-width: 620px;
  color: var(--hj-ink);
  font-weight: 800;
  font-size: clamp(17px, 4vw, 22px);
  line-height: 1.9;
}

#beginner-guide .hj-welcome {
  margin: 48px auto 0;
  max-width: 620px;
  text-align: center;
}

#beginner-guide .hj-welcome__title {
  margin: 0 0 26px;
  color: var(--hj-ink);
  font-weight: 900;
  font-size: clamp(24px, 5.2vw, 34px);
  line-height: 1.5;
  letter-spacing: .05em;
}

#beginner-guide .hj-welcome p {
  margin: 0 0 1.5em;
  color: var(--hj-text);
  font-size: clamp(14.5px, 3.6vw, 16px);
  line-height: 2.05;
}

#beginner-guide .hj-welcome p:last-child {
  margin-bottom: 0;
}


/* =====================================================
   04. キットとは？
===================================================== */
/* FutureShop上位CSSの conceptC レイアウトを使い、このページの幅・背景に合わせる */
#beginner-guide > .conceptC {
  background: var(--hj-bg);
  padding: 0 0 64px;
  margin-bottom: 0;
}

#beginner-guide > .conceptC > .container {
  max-width: var(--hj-width);
  margin-left: auto;
  margin-right: auto;
}

/* このページのみ、上位CSSの明朝体・文字サイズを上書き */
#beginner-guide > .conceptC .conceptC__text,
#beginner-guide > .conceptC .h2C,
#beginner-guide > .conceptC .h2C small,
#beginner-guide > .conceptC .conceptC__text p {
  font-family: inherit !important;
}

#beginner-guide > .conceptC .h2C {
  font-size: 30px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  letter-spacing: .04em !important;
  margin-bottom: 24px !important;
}

#beginner-guide > .conceptC .h2C small {
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .1em !important;
  margin-top: 6px !important;
}

#beginner-guide > .conceptC .conceptC__text p {
  font-size: 14px !important;
  line-height: 1.8 !important;
  font-weight: 500 !important;
}

/* SP */
@media screen and (max-width: 640px) {
  #beginner-guide > .conceptC {
    padding-bottom: 46px;
  }

  #beginner-guide > .conceptC .conceptC__text {
    background: rgba(255, 255, 255, .84) !important;
  }

  #beginner-guide > .conceptC .h2C {
    font-size: 26px !important;
    line-height: 1.4 !important;
  }
}

/* =====================================================
   05. 選ばれる理由
===================================================== */
/* PC・共通 */
#beginner-guide .hj-reasons {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 36px 28px;
  margin-top: 44px;
}

#beginner-guide .hj-reason {
  position: relative;
  text-align: center;
}

#beginner-guide .hj-reason__num {
  position: absolute;
  top: 0;
  left: 0;
  color: var(--hj-pink-d);
  font-weight: 900;
  font-size: 34px;
  line-height: 1;
  font-family: Georgia, "Times New Roman", serif;
}

#beginner-guide .hj-reason__h {
  min-height: 3.2em;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--hj-ink);
  font-weight: 600;
  font-size: 16px;
  line-height: 1.6;
  border-bottom: 2px solid var(--hj-salmon);
  padding-bottom: 14px;
  margin: 0 0 18px;
}

#beginner-guide .hj-reason__icon {
  width: 200px;
  margin: 0 auto;
}

#beginner-guide .hj-reason__icon img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 640px) {
  #beginner-guide .hj-reasons {
    grid-template-columns: 1fr 1fr;
    gap: 28px 16px;
  }

  #beginner-guide .hj-reason {
    text-align: center;
  }

  #beginner-guide .hj-reason__num {
    position: static;
    display: block;
    margin: 0 0 8px;
    text-align: center;
    font-size: 26px;
  }

  #beginner-guide .hj-reason__h {
    min-height: 0;
    display: block;
    text-align: center;
    font-size: 13.5px;
    line-height: 1.55;
    padding-bottom: 12px;
    margin: 0 0 14px;
  }

  #beginner-guide .hj-reason__icon {
    width: 150px;
    margin: 0 auto;
  }
}

/* =====================================================
   06/07. 商品グリッド共通
===================================================== */
/* PC・共通 */
#beginner-guide .hj-catch {
  text-align: center;
  color: var(--hj-pink-d);
  font-weight: 900;
  font-size: clamp(20px, 5vw, 28px);
  margin: 0 0 14px;
  letter-spacing: .04em;
}

#beginner-guide .hj-products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 40px;
}

/* 5商品：1段目3列、2段目2列を同じ幅で中央配置 */
#beginner-guide .hj-products--five {
  grid-template-columns: repeat(6, 1fr);
}

#beginner-guide .hj-products--five .hj-product {
  grid-column: span 2;
}

#beginner-guide .hj-products--five .hj-product:nth-child(4) {
  grid-column: 2 / span 2;
}

#beginner-guide .hj-products--five .hj-product:nth-child(5) {
  grid-column: 4 / span 2;
}

#beginner-guide .hj-product {
  background: var(--hj-white);
  border: 1.5px solid var(--hj-line);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

#beginner-guide .hj-product__photo {
  aspect-ratio: 1/1;
  border: none;
  border-radius: 0;
  overflow: hidden;
}

#beginner-guide .hj-product__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#beginner-guide .hj-product__photo-link {
  display: block;
  width: 100%;
  height: 100%;
}

#beginner-guide .hj-product__photo-link img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#beginner-guide .hj-product__body {
  padding: 16px 16px 18px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

#beginner-guide .hj-product__name {
  margin: 0 0 12px;
  color: var(--hj-ink);
  font-weight: 600;
  font-size: 15px;
  line-height: 1.5;
}

#beginner-guide .hj-product__specs {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 12px;
}

#beginner-guide .hj-spec-row {
  display: flex;
  gap: 8px;
  align-items: baseline;
  font-size: 13px;
}

#beginner-guide .hj-spec-row .k {
  color: var(--hj-sub);
  font-weight: 700;
  flex: none;
  width: 4.5em;
}

#beginner-guide .hj-spec-row .v {
  color: var(--hj-text);
  font-weight: 700;
}

#beginner-guide .hj-stars i {
  font-style: normal;
  color: var(--hj-salmon);
  letter-spacing: .04em;
}

#beginner-guide .hj-stars i.on {
  color: var(--hj-pink);
}

#beginner-guide .hj-product__text {
  margin: 0 0 14px;
  color: var(--hj-sub);
  font-size: 12.5px;
  line-height: 1.75;
}

#beginner-guide .hj-product__more {
  margin-top: auto;
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  border: 1.5px solid var(--hj-pink);
  color: var(--hj-pink-d);
  font-weight: 800;
  font-size: 11.5px;
  padding: 5px 14px;
  border-radius: 999px;
}

#beginner-guide .hj-product__more::after {
  content: "\203a";
}

#beginner-guide .hj-product__more:hover {
  background: var(--hj-pink);
  color: #fff;
}

/* SP */
@media screen and (max-width: 900px) {
  #beginner-guide .hj-products,
  #beginner-guide .hj-products--five {
    grid-template-columns: 1fr 1fr;
  }

  #beginner-guide .hj-products--five .hj-product,
  #beginner-guide .hj-products--five .hj-product:nth-child(4),
  #beginner-guide .hj-products--five .hj-product:nth-child(5) {
    grid-column: auto;
  }
}

@media screen and (max-width: 640px) {
  #beginner-guide .hj-products,
  #beginner-guide .hj-products--five {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

/* =====================================================
   08. キット探し導線
===================================================== */
/* PC・共通 */
#beginner-guide .hj-finder {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 40px;
}

#beginner-guide .hj-tile {
  background: var(--hj-white);
  border: 2px solid var(--hj-salmon-l);
  border-radius: 18px;
  padding: 26px 18px;
  text-align: center;
  transition: transform .15s, box-shadow .15s;
}

#beginner-guide .hj-tile:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(201, 24, 91, .12);
  border-color: var(--hj-pink);
}

#beginner-guide .hj-tile__ico {
  width: 68px;
  margin: 0 auto 14px;
}

#beginner-guide .hj-tile__ico img {
  display: block;
  width: 100%;
  height: auto;
}

#beginner-guide .hj-tile__label {
  color: var(--hj-ink);
  font-weight: 800;
  font-size: 18px;
}

#beginner-guide .hj-tile__label span {
  display: block;
  font-size: 11px;
  color: var(--hj-sub);
  font-weight: 600;
  letter-spacing: .12em;
  margin-top: 4px;
}

/* SP */
@media screen and (max-width: 900px) {
  #beginner-guide .hj-finder {
    grid-template-columns: 1fr 1fr;
  }
}

/* =====================================================
   09. ご注文からお届けまでの流れ
===================================================== */
/* PC・共通 */
#beginner-guide .hj-flow {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: 560px;
  margin: 42px auto 0;
}

#beginner-guide .hj-step {
  background: var(--hj-bg);
  /* border: 1.5px solid var(--hj-line); */
  border-radius: 16px;
  padding: 26px 24px 20px;
  position: relative;
  display: grid;
  grid-template-columns: 66px 1fr;
  gap: 18px;
  align-items: center;
  text-align: left;
}

#beginner-guide .hj-step:not(:last-child) {
  margin-bottom: 84px;
}

#beginner-guide .hj-step:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -54px;
  transform: translateX(-50%);
  width: 64px;
  height: 48px;
  background: var(--hj-salmon-l);
  clip-path: polygon(
    32% 0,
    68% 0,
    68% 42%,
    100% 42%,
    50% 100%,
    0 42%,
    32% 42%
  );
  z-index: 1;
}

#beginner-guide .hj-step__media {
  position: static;
}

#beginner-guide .hj-step__num {
  position: absolute;
  top: -17px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 40px;
  background: var(--hj-salmon);
  color: #fff;
  font-weight: 900;
  font-size: 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  border: 2px solid #fff;
}

#beginner-guide .hj-step__ico {
  width: 66px;
  margin: 0 auto;
}

#beginner-guide .hj-step__ico img {
  display: block;
  width: 100%;
  height: auto;
}

#beginner-guide .hj-step__h {
  color: #5c5c5c;
  font-weight: 800;
  font-size: 20px;
  margin: 0 0 6px;
}

#beginner-guide .hj-step__t {
  color: #5c5c5c;
  font-size: 13px;
  line-height: 1.75;
}

#beginner-guide .hj-support {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  max-width: var(--hj-width);
  margin: 40px auto 0;
}

#beginner-guide .hj-support__lead {
  grid-column: 1 / -1;
  text-align: center;
  color: var(--hj-text);
  font-size: 16px;
  line-height: 1.9;
  margin: 0 0 4px;
}

#beginner-guide .hj-support__imagebtn {
  display: block;
}

/* 1枚のみ公開時は、2カラム時の幅を保ったまま中央配置 */
#beginner-guide .hj-support__imagebtn:only-of-type {
  grid-column: 1 / -1;
  width: calc((100% - 18px) / 2);
  justify-self: center;
}

#beginner-guide .hj-support__imagebtn img {
  display: block;
  width: 100%;
  height: auto;
}

/* SP */
@media screen and (max-width: 640px) {
  #beginner-guide .hj-support {
    grid-template-columns: 1fr;
  }

  #beginner-guide .hj-support__imagebtn:only-of-type {
    width: 100%;
  }
}

/* =====================================================
   10. 社会との連携
===================================================== */
/* PC・共通 */
#beginner-guide .hj-links {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 44px;
}

#beginner-guide .hj-linkitem {
  text-align: center;
}

#beginner-guide .hj-linkitem__ph {
  width: 220px;
  max-width: 100%;
  margin: 0 auto 16px;
}

#beginner-guide .hj-linkitem__ph img {
  display: block;
  width: 100%;
  height: auto;
}

#beginner-guide .hj-linkitem__t {
  color: var(--hj-ink);
  font-weight: 700;
  font-size: 15px;
  line-height: 1.7;
}

/* SP */
@media screen and (max-width: 640px) {
  #beginner-guide .hj-links {
    grid-template-columns: 1fr;
  }

  #beginner-guide .hj-links {
    gap: 22px;
  }
}

/* =====================================================
   11. 施設・医療現場向けCTA
===================================================== */
/* PC・共通 */
#beginner-guide .hj-facility-band {
  position: relative;
  max-width: var(--hj-width);
  margin: 0 auto;
  overflow: hidden;
  isolation: isolate;
}

#beginner-guide .hj-facility-band__bg {
  position: absolute;
  inset: 0;
  display: block;
  border: none;
  border-radius: 0;
  z-index: -2;
  overflow: hidden;
}

#beginner-guide .hj-facility-band__bg img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left top;
}

#beginner-guide .hj-facility-band::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(217, 210, 228, .3);
  z-index: -1;
}

#beginner-guide .hj-facility-band__inner {
  padding: 64px 24px 72px;
  text-align: center;
}

#beginner-guide .hj-facility-band__title {
  margin: 0 0 34px;
  color: #fff;
  font-weight: 900;
  font-size: clamp(24px, 5.4vw, 36px);
  line-height: 1.5;
  letter-spacing: .05em;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .45);
}

#beginner-guide .hj-facility-band__panel {
  max-width: 540px;
  margin: 0 auto;
  background: rgba(27, 32, 31, .60);
  border-radius: 4px;
  padding: 40px 28px 44px;
}

#beginner-guide .hj-facility-band__panel p {
  color: #fff;
  font-size: clamp(15px, 3.8vw, 18px);
  line-height: 2;
  margin: 0 0 1.6em;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .5);
}

#beginner-guide .hj-facility-band__panel p:last-of-type {
  margin-bottom: 30px;
}

#beginner-guide .hj-facility-band__btn {
  display: inline-block;
  color: #fff;
  font-weight: 800;
  font-size: clamp(18px, 4.4vw, 24px);
  letter-spacing: .06em;
  padding: 0 8px 12px;
  border-bottom: 2px solid rgba(255, 255, 255, .9);
  text-shadow: 0 1px 6px rgba(0, 0, 0, .5);
}

/* SP */
@media screen and (max-width: 640px) {
  #beginner-guide .hj-facility-band__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left top;
  }
}