.sp .main-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  padding: calc(200 / 375 * 100vw) calc(20 / 375 * 100vw);
  position: relative;
}

.sp .main-container .section-title {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sp .main-container .text {
  display: block;
  width: 100%;
  height: calc(70 / 375 * 100vw);
}

.sp .main-container .text img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  image-rendering: -webkit-optimize-contrast;
}

.sp .main-container .login {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(60 / 375 * 100vw);
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sp .main-container .SNS {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  gap: calc(32 / 375 * 100vw);
  padding: calc(60 / 375 * 100vw) 0px;
  position: relative;
  border-radius: calc(10 / 375 * 100vw);
}

.sp .main-container .div {
  position: relative;
  width: fit-content;
  margin-top: calc(-1 / 375 * 100vw);
  font-family: var(--body-large-bold-font-family);
  font-weight: var(--body-large-bold-font-weight);
  color: #000000;
  font-size: var(--body-large-bold-font-size);
  letter-spacing: var(--body-large-bold-letter-spacing);
  line-height: var(--body-large-bold-line-height);
  white-space: nowrap;
  font-style: var(--body-large-bold-font-style);
}

.sp .main-container .text-wrapper-2 {
  position: relative;
  align-self: stretch;
  font-family: var(--body-regular-14-font-family);
  font-weight: var(--body-regular-14-font-weight);
  color: var(--variable-collection-gray);
  font-size: var(--body-regular-14-font-size);
  letter-spacing: var(--body-regular-14-letter-spacing);
  line-height: var(--body-regular-14-line-height);
  font-style: var(--body-regular-14-font-style);
  text-align: center;
}

.sp .main-container .SNS-button-group {
  flex-direction: column;
  align-items: flex-start;
  gap: calc(12 / 375 * 100vw);
  display: flex;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sp .main-container .SNS-button {
  display: block;
  width: 100%;
}

.sp .main-container .SNS-button img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  image-rendering: -webkit-optimize-contrast;
}

.pc .main-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  padding: calc(100 / 1440 * 100vw) calc(200 / 1440 * 100vw);
  position: relative;
}

.pc .main-container .section-title {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.pc .main-container .text {
  display: block;
  width: calc(1040 / 1440 * 100vw);
}

.pc .main-container .text img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  image-rendering: -webkit-optimize-contrast;
}

.pc .main-container .login {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(60 / 1440 * 100vw);
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.pc .main-container .SNS {
  display: flex;
  flex-direction: column;
  width: calc(440 / 1440 * 100vw);
  align-items: center;
  gap: calc(32 / 1440 * 100vw);
  padding: calc(60 / 1440 * 100vw) 0px;
  position: relative;
  border-radius: calc(10 / 1440 * 100vw);
}

.pc .main-container .div {
  position: relative;
  width: fit-content;
  margin-top: calc(-1 / 1440 * 100vw);
  font-family: var(--body-large-bold-font-family);
  font-weight: var(--body-large-bold-font-weight);
  color: #000000;
  font-size: var(--body-large-bold-font-size);
  letter-spacing: var(--body-large-bold-letter-spacing);
  line-height: var(--body-large-bold-line-height);
  white-space: nowrap;
  font-style: var(--body-large-bold-font-style);
}

.pc .main-container .text-wrapper-2 {
  position: relative;
  align-self: stretch;
  font-family: var(--body-regular-14-font-family);
  font-weight: var(--body-regular-14-font-weight);
  color: var(--variable-collection-gray);
  font-size: var(--body-regular-14-font-size);
  letter-spacing: var(--body-regular-14-letter-spacing);
  line-height: var(--body-regular-14-line-height);
  font-style: var(--body-regular-14-font-style);
  text-align: center;
}

.pc .main-container .SNS-button-group {
  flex-direction: column;
  align-items: flex-start;
  gap: calc(12 / 1440 * 100vw);
  display: flex;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.pc .main-container .SNS-button {
  display: block;
  width: calc(440 / 1440 * 100vw);
}

.pc .main-container .SNS-button img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  image-rendering: -webkit-optimize-contrast;
}
