@charset "utf-8";
:root{
  --cl-pink:#EA8E9E;
}

/* 共通 */
/* ======================================== */
#bloom{
  font-size: 16px;
}
#bloom .inner{
  padding: 0 20px;
}

#bloom .cl.pk{
  color: var(--cl-pink);
}

/* section kv */
/* ======================================== */
#bloom #kv{
  text-align: center;
}

#bloom #kv .area_intro{
  line-height: 2.5em;
  letter-spacing: 0.64px;
  margin: 68px 0 78px;
}
#bloom #kv .area_intro .txt_top{
  margin-bottom: 40px;
}
#bloom #kv .area_intro .logo_ttb{
  width: 320px;
  margin: 0 auto 48px;
}

#bloom #kv .area_link{
  display: grid;
  justify-content: center;
  align-items: center;
  gap: 50px;
  grid-auto-flow: column;
  margin: 0 auto 78px;
}

#bloom #kv .area_link a{
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.88px;
}

#bloom #kv .area_link .mark_slash{
  width: 77px;
}
#bloom #kv .area_notice{
  font-weight: 500;
  margin-bottom: 20px;
}

#bloom #kv .area_notice .box{
  border: 1px solid var(--cl-pink);
  width: 448px;
  height: 66px;
  margin: 0 auto 30px;
  display: grid;
  place-content: center;

}

#bloom .social{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 28px;
}

#bloom .social li{
  width: 34px;
}

#bloom .social li.x{
  width: 30px
}

#bloom .social li img{
  width: 100%
}

#bloom .social+h2{
  display: flex;
  justify-content: center;
  margin-top: 18px
}

#bloom .social+h2 img{
  width: 66px;
}

/* ===========================================
 * sp
 * ======================================== */
@media(max-width: 768px){
/* 共通 */
/* ======================================== */
  #bloom{
    font-size: 14px;
  }
  #bloom .inner{
    padding: 0 10px;
  }
/* section kv */
/* ======================================== */
  #bloom #kv .area_intro{
    margin: 50px 0 80px;
    padding: 0 20px;
    line-height: 2.26em;
    letter-spacing: 0.28px;
    font-size: 15px
  }
  #bloom #kv .area_link{
    grid-auto-flow: row;
    place-items: center;
    gap: 12px;
    margin-bottom: 80px;
    pointer-events: none;
  }
  #bloom #kv .area_link .mark_slash{
    width: 44px;
  }
  #bloom #kv .area_notice{
    font-size: 16px;
    line-height: 1.5;
  }
  #bloom #kv .area_notice .box{
    width: 100%;
    max-width: 400px;
  }

 }
