@charset "utf-8";
/* login.css
++++++++++++++++++++++++++++++++++++++++
* NOTE
++++++++++++++++++++++++++++++++++++++++
- Charset: utf-8
- Return code: LF
++++++++++++++++++++++++++++++++++++++++ */

/* override
++++++++++++++++++++++++++++++++++++++++ */
/* header login button */
.header-corp ._actions .btn-login.-sp {
  display: none !important;
}

/* container */
@keyframes AnimationName {
  0%   { background-position:   0% 10%}
  50%  { background-position: 100% 90%}
  100% { background-position:   0% 10%}
}
.l-container.login-container {
  background: linear-gradient(130deg, #c4dff4, #e1d8fa, #faedcd);
  background-size: 600% 600%;
  animation: AnimationName 10s ease infinite;
}

@media (max-width: 767.98px) {
  .l-container.login-container {
    margin-top: -64px;
    padding-top: 64px;
  }
  .login-container .l-main {
    padding-top: 0;
  }
}


/* module
++++++++++++++++++++++++++++++++++++++++ */
.login-ttl {
  margin: 32px auto;
  font-size: 2.8rem;
  line-height: 1.2857;
  font-weight: normal;
  text-align: center;
}

.login-btn {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overflow: hidden;

  position: relative;
  display: block;
  width: 240px;
  margin: 0 auto 112px;

  text-align: center;
  text-decoration: none;
  cursor: pointer;
  padding: 10px 22px;
  padding-top: 14px;
  padding-bottom: 14px;
  border-radius: 4px;
  border: 2px solid currentColor;
  background-color: rgba(255,255,255,0.6);
  color: var(--color-rich-black);
  font-size: 1.8rem;
  line-height: 1.5;
}
.login-btn:hover {
  color: var(--color-rich-black);
}
.login-btn::after {
  position: absolute;
  top: 50%;
  right: 16px;
  display: block;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  background-size: 14px auto;
  background-repeat: no-repeat;
  background-position-x: 0;
  background-size: contain;
  background-image: url(/assets/images/icon/link/icon-link-blank.svg); 
  content: "";
}


/* list
++++++++++++++++++++++++++++++++++++++++ */
.login-applist {
  margin: 0;
  padding: 0 0 4px;
  list-style: none;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(328px, 1fr));
  gap: 16px;
}

.login-applist > li {
  margin: 0;
  padding: 0;
}

.login-applist > li > a {
  position: relative;
  display: block;
  margin: 0;
  padding: 24px 40px 24px 100px;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.54);
  font-size: 1.2rem;
  line-height: 2.4rem;
  letter-spacing: 0.1px;
  text-decoration: none;
}
.login-applist > li > a:hover {
  color: inherit;
}
.login-applist > li > a > b {
  font-size: 1.8rem;
  line-height: 1;
  font-weight: normal;
  vertical-align: baseline;
}
.login-applist > li > a > small {
  float: right;
  color: var(--color-rich-black-060);
  font-size: inherit;
  letter-spacing: normal;
}
.login-applist > li > a::after {
  position: absolute;
  top: 50%;
  right: 16px;
  display: block;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  background-repeat: no-repeat;
  background-position-x: 0;
  background-size: contain;
  background-image: url(/assets/images/icon/link/icon-link-arrow.svg);
  content: "";
}
.login-applist [href*="sso.click-sec.com"]::after {
  background-image: url(/assets/images/icon/link/icon-link-blank.svg); 
}

.login-applist > li > a::before {
  position: absolute;
  top: calc(50% - 12px);
  left: 16px;
  display: block;
  width: 68px;
  height: 24px;
  background-size: contain;
  background-repeat: no-repeat;
  content: "";
}
.login-applist [href="https://gmoclickkabu.go.link/hwCBm"]::before,
.login-applist [href="https://gmoclickkabu.page.link/4Yif"]::before {
  background-image: url(/assets/images/icon/service/label-service-kabu.svg);
}
.login-applist [href*="sso-redirect?s=01&p=08&sp=20"]::before {
  background-image: url(/assets/images/icon/service/label-service-fund.svg);
}
.login-applist [href="https://gmoclickfxneo.go.link/aGg4A"]::before {
  background-image: url(/assets/images/icon/service/label-service-fxneo.svg);
}
.login-applist [href="https://gmoclickcfd.go.link/eyz4x"]::before {
  background-image: url(/assets/images/icon/service/label-service-cfd.svg);
}
.login-applist [href*="365"]::before {
  background-image: url(/assets/images/icon/service/label-service-clk365.svg);
}
.login-applist [href$="/mobile/fxop/"]::before {
  background-image: url(/assets/images/icon/service/label-service-fxop.svg);
}
.login-applist [href$="/mobile/ixop/"]::before {
  background-image: url(/assets/images/icon/service/label-service-ixop.svg);
}
.login-applist [href*="sso-redirect?s=01&p=41&sp=01"]::before {
  background-image: url(/assets/images/icon/service/label-service-fbond.svg);
}