@charset "UTF-8";
body {
  justify-content: center;
  background: var(--body-background-color, hsl(0 0% 100%));
}
.bg {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiIHZpZXdCb3g9IjAgMCAxMDAwIDEwMDAiPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjUwMCIgeDI9IjUwMCIgeTE9IjUwMCIgeTI9IjEwMDAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9ImhzbCgwIDEwMCUgNTAlLzE1JSkiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9ImhzbCgwIDEwMCUgNTAlLzAlKSIvPjwvbGluZWFyR3JhZGllbnQ+PHBhdGggZmlsbD0idXJsKCNhKSIgZD0iTTEwMDAgMTAwMEgwVjUwMGM1MDAtMjUwIDUwMCAyNTAgMTAwMCAwdjUwMHoiLz48L3N2Zz4=);
    background-repeat: repeat-x;
    background-position-y: center;
    background-size: var(--bgw) var(--bgh, 100%);
    --bgw: clamp(80em, var(--VWidth), 1920px);
    animation: hue 30s linear infinite, wave 30s linear infinite;
    opacity: var(--brightness-filter, 0.5);
  }
  .bg::after,
  .bg::before {
    content: "";
    display: block;
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: inherit;
    background-repeat: inherit;
    background-position-y: inherit;
    background-size: var(--bgw) var(--bgh);
    animation: wave var(--dr) var(--dl) linear infinite reverse;
  }
  .bg::before {
    --bgh: 70%;
    --dl: -5s;
    --dr: 20s;
  }
  .bg::after {
    --bgh: 50%;
    --dl: -5s;
    --dr: 10s;
  }
  @keyframes hue {
    0%,
    100%,
    50% {
      filter: hue-rotate(210deg);
    }
    25% {
      filter: hue-rotate(240deg);
    }
    75% {
      filter: hue-rotate(180deg);
    }
  }
  @keyframes wave {
    0% {
      background-position-x: 0;
    }
    100% {
      background-position-x: var(--bgw);
    }
  }
#login_header {
  width: 100%;
  max-width: 90em;
  margin-inline: auto;
}
#login_header > .inner {
  height: 6em;
  padding-inline: 2em;
  display: flex;
  align-items: center;
}
#login_header #logo {
  margin-inline: 2em;
}
#login_header #logo h1 {
  font-size: 1em;
  display: block;
  height: 2em;
  aspect-ratio: 183/61;
  background: url(../images/seagm_member_logo_2020_text_black-2ad8c54e98.svg)
    no-repeat center/contain;
  filter: invert(var(--brightness-filter, -1));
  color: transparent;
}
#login_footer {
  width: 100%;
  max-width: 90em;
  margin-inline: auto;
}
#login_footer > .inner {
  padding: 2em;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  column-gap: 2em;
}
#login_footer .copyright {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0.5em;
  opacity: 0.5;
}
#login_footer .copyright::before {
  content: attr(icon);
  display: block;
  font-size: 1.5em;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
}
#login_footer .nav ul {
  display: flex;
  gap: 1em;
}
#login_footer .nav a {
  color: currentColor;
}
#login_footer .language .lang {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 1em;
  background: var(--body-text-color-a5, #fff);
  border-radius: 3em;
  height: 3em;
  padding-inline: 1em 0;
  position: relative;
  cursor: pointer;
  transition: background 0.3s;
}
#login_footer .language .lang::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  inset-block-start: 50%;
  inset-inline-end: 0;
  margin-block-start: -0.166667em;
  margin-inline-end: 1em;
  border: 0.333334em transparent solid;
  border-top-color: var(--body-text-color-a25, rgba(0 0 0/25%));
  pointer-events: none;
}
#login_footer .language .lang > span::before {
  content: attr(icon);
  display: block;
  font-size: 1.5em;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
  opacity: 0.5;
}
#login_footer .language .lang > select {
  all: unset;
  height: 3em;
  line-height: 3;
  padding-inline-end: 2.5em;
}
#login_footer .language .lang > select option {
  color: var(--body-text-color);
  background: var(--background-color-L1);
}
#reg_content {
  width: 100%;
  max-width: 90em;
  margin-inline: auto;
}
#reg_content > .inner {
  padding-inline: 2em;
}
#reg_box {
  border-radius: 2em;
  background-color: var(--body-text-color-a5, rgba(255 255 255/25%));
  background-image: linear-gradient(
    to var(--inline-end, right),
    rgba(0 0 0/0%),
    rgba(0 0 0/2%) 50%
  );
  -webkit-backdrop-filter: blur(1em);
  backdrop-filter: blur(1em);
  box-shadow: rgba(0 0 0/5%) 0 1em 4em;
}
#reg_box > .inner {
  display: grid;
  grid-template-columns: max(30em, 40%) 1fr;
  min-height: 35em;
}
#reg_form_wrp {
  padding: 5em;
  display: flex;
  flex-direction: column;
  border-radius: 2em;
  background-color: var(--background-color-L3, #fff);
  background-image: radial-gradient(
      circle at center top,
      rgba(255 255 255/10%) 0%,
      rgba(255 255 255/0) 100%
    ),
    radial-gradient(
      circle at center bottom,
      rgba(255 255 255/5%) 0%,
      rgba(255 255 255/0) 50%
    );
  box-shadow: rgba(255 255 255/10%) 0 1px 0 0 inset;
  transition: transform 0.3s, box-shadow 0.3s;
}
#reg_info_wrp {
  order: -1;
  padding: 5em;
}
#reg_form_wrp > .inner {
  width: 100%;
  max-width: 30em;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 2em;
  flex: auto;
  justify-content: space-between;
  transition: transform 0.3s;
}
#reg_form_wrp.form > .inner {
  max-width: 40em;
}
#reg_form {
  display: flex;
  flex-direction: column;
  gap: 1.5em;
}
#reg_form h2 {
  font-size: 2em;
  font-weight: 800;
  text-transform: uppercase;
}
#reg_form p {
  margin: 0;
}
#reg_form .input > label {
  display: flex;
  align-items: center;
  gap: 1.5em;
  padding-inline: 1.5em;
  height: 4em;
  border-radius: 4em;
  background: var(--background-color-L3, rgba(0 0 0/5%));
  transition: box-shadow 0.3s;
}
#reg_form .input > label > span {
  display: block;
  width: 2em;
  height: 2em;
  overflow: hidden;
  transition: color 0.3s;
}
#reg_form .input > label > span::before {
  content: attr(icon);
  display: block;
  font-size: 2em;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
}
#reg_form .input > label > input {
  all: unset;
  flex: auto;
  height: 3em;
  color: currentColor;
  font-weight: 800;
  transition: background-color 999999s;
}
#reg_form .input > label > input::-webkit-input-placeholder {
  font-weight: 600;
  color: var(--body-text-color-a50, rgba(0 0 0/50%));
}
#reg_form .input > label:focus-within {
  box-shadow: var(--SiteTHM-A75) 0 0 0 0.25em,
    var(--SiteTHM-A10) 0 0 0 99em inset;
}
#reg_form .input > label:focus-within > span[icon] {
  color: var(--SiteTHM);
}
#reg_form .tips_wrp {
  margin-inline: 1.5em;
}
#reg_form .tips_wrp > div {
  margin-block-start: 1em;
}
#reg_form .tips_wrp > div:not(.tips, .show) {
  display: none;
}
#reg_form .tips_wrp .tips {
  color: var(--body-text-color-a50, rgba(0 0 0/50%));
}
#reg_form .tips_wrp .success {
  color: var(--text-color-complete);
  font-weight: 800;
}
#reg_form .tips_wrp .alert {
  color: var(--text-color-alert);
  font-weight: 800;
}
#reg_form .btc {
  text-align: center;
}
#reg_form .btw {
  font-size: 1.166667em;
  text-transform: uppercase;
}
#reg_form .email_address {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 1.5em;
  height: 4em;
  padding-inline: 1.5em;
  border-radius: 4em;
  background: var(--background-color-L3, rgba(0 0 0/5%));
}
#reg_form .email_address::before {
  content: attr(icon);
  display: block;
  font-size: 2em;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
  opacity: 0.5;
}
#reg_form .email_address span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 1.166667em;
  font-weight: 800;
}
#reg_form .user_email_address {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 1.5em;
}
#reg_form .user_email_address::before {
  content: attr(icon);
  display: block;
  font-size: 2em;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
}
#reg_form .user_email_address span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 1.166667em;
  font-weight: 800;
}
#reg_form .form {
  display: grid;
  grid-template-columns: max(25%, 8em) 1fr;
  gap: 1em;
  padding-block-start: 2em;
  margin-block-start: 0.5em;
  background: linear-gradient(
      90deg,
      transparent,
      var(--body-text-color-a5, rgba(0 0 0/5%)),
      transparent
    )
    no-repeat center 0/100% 1px;
}
#reg_form .form .T > span {
  min-height: 3em;
  display: flex;
  align-items: center;
}
#reg_form .form .C {
  grid-column: 2/3;
}
#reg_form .form [class*="cpt-"] {
  --CPT-UH: 3.5em;
  --CPT-BDR: 1.75em;
}
#reg_form .form .cpt-select > span,
#reg_form .form .cpt-text > span {
  padding-inline: 1.333334em;
}
#reg_form .form .cpt-select > span + select,
#reg_form .form .cpt-text > span + input {
  padding-inline-start: 0;
  border-radius: 0;
}
#reg_form .form [currency]::before,
#reg_form .form [region]::before {
  --h: 1.5em;
}
#reg_form .form #country_code {
  font-weight: 800;
  min-width: 4.666667em;
  box-sizing: border-box;
}
#reg_form .form .reg_btc {
  display: flex;
  flex-direction: column;
  gap: 1em;
  margin-block-start: 1em;
}
#reg_form .form #reg_btw {
  display: block;
  font-size: 1.166667em;
}
#reg_form .form .terms {
  margin-inline: 1.5em;
  text-align: center;
}
#reg_form .form .terms a {
  display: inline-block;
  vertical-align: top;
  font-weight: 800;
}
#reg_form .form .password_show::before {
  content: "visibility";
  opacity: 0.5;
}
#reg_form .form .password_visible::before {
  content: "visibility_off";
  opacity: 1;
}
#connect_icon {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  column-gap: 2em;
  grid-auto-flow: dense;
  width: fit-content;
}
#connect_icon::before {
  content: attr(icon);
  display: block;
  font-size: 2em;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
  grid-column: 2/3;
  margin-inline: auto;
  opacity: 0.5;
}
#connect_icon span {
  border-radius: 25%;
  width: 4em;
  height: 4em;
  overflow: hidden;
}
#connect_icon span::before {
  display: block;
  font-size: 2.5em;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
  margin: 0.3em;
}
#connect_icon span:not(.seagm) {
  background: var(--hex);
  background-image: linear-gradient(
    135deg,
    hsl(calc(var(--h) - 5) var(--s) var(--l)),
    hsl(calc(var(--h) + 5) var(--s) var(--l))
  );
  color: #fff;
}
#connect_icon span.seagm {
  background: #000
    linear-gradient(135deg, rgba(255 255 255/25%), rgba(255 255 255/0%));
  box-shadow: rgba(255 255 255/5%) 0 0 0 1px;
}
#connect_icon span.seagm::before {
  content: "";
  background: url(../images/seagm_logo_2020_shield-a28166db3a.svg) no-repeat
    center bottom/auto 90%;
}
#connect_icon ~ h2 {
  font-size: 1.333334em;
  text-transform: unset;
}
#connect_icon ~ h2 b {
  font-weight: 800;
}
#login_form_sns {
  display: flex;
  flex-direction: column;
  gap: 1em;
}
#login_form_sns h3 {
  font-size: 1em;
  text-align: center;
  opacity: 0.5;
}
#login_form_sns .sns_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#login_form_sns .sns_list a {
  box-shadow: unset;
}
#login_form_sns .sns_list a:not(:hover, :focus) {
  background: 0 0;
  color: currentColor;
}
#reg_info_wrp > .inner {
  display: flex;
  flex-direction: column;
  gap: 1.5em;
}
#reg_info_wrp h2 {
  font-size: 1.666667em;
  font-weight: 800;
  text-transform: uppercase;
}
#reg_info_wrp p {
  font-size: 1.166667em;
  margin: 0;
  opacity: 0.7;
}
#reg_info_wrp .reg_steps {
  display: flex;
  flex-direction: column;
  gap: 1em;
}
#reg_info_wrp .reg_steps > li {
  counter-increment: steps;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1em;
  align-items: center;
}
#reg_info_wrp .reg_steps > li::before {
  content: counter(steps);
  display: block;
  font-size: 1.5em;
  font-weight: 800;
  width: 2em;
  aspect-ratio: 1;
  line-height: 2;
  overflow: hidden;
  text-align: center;
  color: var(--body-text-color, rgba(0 0 0/75%));
  background: var(--body-text-color-a5, rgba(0 0 0/5%));
  border-radius: 0.5em;
  align-self: start;
}
@media only screen and (max-width: 1000px) {
  #login_header > .inner {
    max-width: 40em;
    margin-inline: auto;
    box-sizing: border-box;
  }
  #login_header #logo {
    margin-inline: 0;
  }
  #login_footer > .inner {
    max-width: 40em;
    margin-inline: auto;
    box-sizing: border-box;
    grid-template-columns: 1fr;
    row-gap: 1.5em;
    align-items: start;
  }
  #login_footer .copyright {
    width: fit-content;
    margin-inline: auto;
  }
  #login_footer .nav {
    order: -1;
  }
  #login_footer .nav ul {
    justify-content: center;
    flex-wrap: wrap;
  }
  #login_footer .language .lang {
    width: fit-content;
    margin-inline: auto;
    box-shadow: var(--body-text-color-a5, rgba(0 0 0/5%)) 0 0 0 1px inset;
  }
  #reg_box {
    max-width: 40em;
    margin-inline: auto;
  }
  #reg_box > .inner {
    grid-template-columns: 1fr;
  }
  #reg_form_wrp {
    padding: 4em;
    --tigoo-w: 6em;
  }
  #reg_form h2 {
    font-size: 1.666667em;
  }
  #reg_form .btw {
    font-size: 1em;
  }
  #login_form_sns {
    padding-block-start: 2em;
    background-image: linear-gradient(
        90deg,
        transparent,
        rgba(0 0 0/5%),
        transparent
      ),
      linear-gradient(90deg, transparent, rgba(255 255 255/5%), transparent);
    background-repeat: no-repeat;
    background-position: center 0, center 1px;
    background-size: 100% 1px;
  }
  #reg_info_wrp {
    padding: 4em;
    order: 9;
  }
  #reg_info_wrp > .inner {
    width: 100%;
    max-width: 30em;
    margin-inline: auto;
    gap: 1em;
  }
  #reg_info_wrp h2 {
    font-size: 1.333334em;
  }
  #reg_form_wrp.form > .inner {
    max-width: 30em;
  }
  #reg_form .user_email_address span {
    font-size: 1em;
  }
  #reg_form .form {
    grid-template-columns: 1fr;
  }
  #reg_form .form .T > span {
    min-height: unset;
    margin-inline: 1.5em;
    font-weight: 800;
  }
  #reg_form .form .C {
    grid-column: inherit;
  }
  #reg_form .form .C ~ .T {
    margin-block-start: 1em;
  }
}
@media only screen and (max-width: 480px) {
  #login_footer > .inner,
  #login_header > .inner,
  #reg_content > .inner {
    padding-inline: 1.5em;
  }
  #login_header #logo h1 {
    height: 1.75em;
  }
  #login_footer > .inner {
    padding-block-start: 2em;
    background: linear-gradient(
        90deg,
        transparent,
        var(--body-text-color-a5, rgba(0 0 0/5%)),
        transparent
      )
      no-repeat center 0/100% 1px;
  }
  #reg_box {
    background: unset;
    -webkit-backdrop-filter: unset;
    backdrop-filter: unset;
    box-shadow: unset;
  }
  #reg_form_wrp {
    padding: 2em;
    border-radius: 1em;
    box-shadow: rgb(0 0 0/10%) 0 0 4em;
    transform: none !important;
  }
  #reg_form_wrp > .inner {
    transform: none !important;
  }
  #reg_form h2 {
    font-size: 1.333334em;
  }
  #reg_info_wrp {
    padding: 2em;
  }
  #reg_info_wrp h2 {
    font-size: 1.166667em;
  }
  #connect_icon span {
    width: 3em;
    height: 3em;
  }
  #connect_icon span::before {
    font-size: 2em;
    margin: 0.25em;
  }
}
#SNS_connect_wrp {
  padding: 5em;
  display: flex;
  flex-direction: column;
  border-radius: 2em;
  background-color: var(--background-color-L3, #fff);
  background-image: radial-gradient(
      circle at center top,
      rgba(255 255 255/10%) 0%,
      rgba(255 255 255/0) 100%
    ),
    radial-gradient(
      circle at center bottom,
      rgba(255 255 255/5%) 0%,
      rgba(255 255 255/0) 50%
    );
  box-shadow: rgb(255 255 255/10%) 0 1px 0 0 inset;
  transition: transform 0.3s, box-shadow 0.3s;
}
#SNS_connect_wrp > .inner {
  width: 100%;
  max-width: 30em;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 2em;
  flex: auto;
  justify-content: space-between;
  text-align: center;
}
#SNS_connect_wrp h2 {
  font-size: 2em;
  font-weight: 800;
}
#SNS_connect_wrp .btc .btw {
  font-size: 1.166667em;
  text-transform: uppercase;
}
#connect_icon_v {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 0.5em 1em;
}
#connect_icon_v::before {
  content: attr(icon);
  display: block;
  font-size: 2em;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
  opacity: 0.5;
  margin-block: 0.75em;
}
#connect_icon_v .brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1em 2em;
}
#connect_icon_v .brand:first-of-type {
  order: -1;
}
#connect_icon_v .icon {
  border-radius: 25%;
  width: 5em;
  height: 5em;
  overflow: hidden;
}
#connect_icon_v .icon::before {
  display: block;
  font-size: 3em;
  width: 1em;
  height: 1em;
  line-height: 1;
  overflow: hidden;
  margin: 0.333334em;
}
#connect_icon_v .icon:not(.seagm) {
  background: var(--hex);
  background-image: linear-gradient(
    135deg,
    hsl(calc(var(--h) - 5) var(--s) var(--l)),
    hsl(calc(var(--h) + 5) var(--s) var(--l))
  );
  color: #fff;
}
#connect_icon_v .icon.seagm {
  background: #000
    linear-gradient(135deg, rgba(255 255 255/25%), rgba(255 255 255/0%));
  box-shadow: rgba(255 255 255/5%) 0 0 0 1px;
}
#connect_icon_v .icon.seagm::before {
  content: "";
  background: url(../images/seagm_logo_2020_shield-a28166db3a.svg) no-repeat
    center bottom/auto 90%;
}
#connect_icon_v .info {
  display: flex;
  flex-direction: column;
  gap: 0.5em;
}
#connect_icon_v .name {
  font-size: 1.333334em;
  font-weight: 800;
}
#connect_icon_v .mail {
  opacity: 0.5;
}
@media only screen and (max-width: 1000px) {
  #SNS_connect_wrp h2 {
    font-size: 1.666667em;
  }
  #SNS_connect_wrp > .inner {
    text-align: start;
  }
  #connect_icon_v {
    width: 100%;
    grid-template-columns: 1fr;
  }
  #connect_icon_v::before {
    transform: rotate(90deg);
    margin-block: 0;
    margin-inline: 0.5em;
  }
  #connect_icon_v .brand {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
  }
  #connect_icon_v .icon {
    width: 4em;
    height: 4em;
  }
  #connect_icon_v .icon::before {
    font-size: 2.5em;
    margin: 0.3em;
  }
  #connect_icon_v .info {
    gap: 0;
  }
}
@media only screen and (max-width: 480px) {
  #SNS_connect_wrp {
    padding: 3em;
    border-radius: 1em;
    box-shadow: rgb(0 0 0/10%) 0 0 4em;
  }
  #SNS_connect_wrp h2 {
    font-size: 1.333334em;
  }
  #SNS_connect_wrp .btc .btw {
    display: block;
  }
  #connect_icon_v .name {
    font-size: 1.166667em;
  }
}
