/* hover
=================================================================== */
/* ================================================ vw */
/* ================================================ vh */
/* common
=================================================================== */
/* layout
=================================================================== */
/* imgCover
=================================================================== */
/* mask
=================================================================== */
/* background
=================================================================== */
/* flex
=================================================================== */
/* animation delay
=================================================================== */
/* 3d
=================================================================== */
/* font
=================================================================== */
/* textTate
=================================================================== */
/* vw
=================================================================== */
/* form
=================================================================== */
/* ============================================================================================ login */
.login .pagesInner__flex .pagesArticle {
  width: 63%;
}
.login .pagesInner__flex .pagesInner__nav {
  width: 33%;
}

body * {
  color: rgba(var(--color-text), 1);
}

/* ================================================ inputs */
input.inputs {
  position: relative;
  padding: 1.8301610542vw 2.196193265vw 1.8301610542vw 6.588579795vw;
  font-size: 20px;
  font-size: 1.4641288433vw;
  border-width: 2px;
  border-style: solid;
  border-color: #9fa0a0;
  background-color: #f7f8f8;
  border-radius: 0.7320644217vw;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
  -ms-transition-duration: 0.2s;
  -ms-transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
  -webkit-transition-duration: 0.2s;
  -webkit-transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
  -moz-transition-duration: 0.2s;
  -moz-transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
}

input.inputs::placeholder {
  font-size: 20px;
  font-size: 1.4641288433vw;
  color: rgba(var(--color-text), 0.4);
}

input.inputs:focus {
  background-color: #fff;
}

/* --------------------------------------- form-error */
.form-error {
  font-size: 14px;
  font-size: 1.0248901903vw;
  line-height: 2;
}

/* --------------------------------------- inputs__icon */
.inputsWrapper {
  position: relative;
  margin-bottom: 2.196193265vw;
  z-index: 1;
}

.inputs__icon {
  position: absolute;
  height: 5.4904831625vw;
  width: 6.2225475842vw;
  top: 0;
  left: 0;
  z-index: 2;
  pointer-events: none;
}
.inputs__icon .icon {
  position: absolute;
  width: 3vw;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  left: 60%;
}
.inputs__icon .iconInner {
  background-color: rgba(var(--color-text), 0.4);
}

/* --------------------------------------- sendBtn */
.sendBtn {
  position: sticky;
  bottom: 0.7320644217vw;
  z-index: 2;
}

.sendBtn__inner {
  font-size: 24px;
  font-size: 1.756954612vw;
  height: 5.8565153734vw;
  line-height: 5.8565153734vw;
  text-align: center;
  background-color: rgba(var(--keyColor-base), 1);
  border-radius: 0.7320644217vw;
  border-width: 2px;
  border-style: solid;
  border-color: rgba(var(--keyColor-base), 1);
  cursor: pointer;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
  -ms-transition-duration: 0.2s;
  -ms-transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
  -webkit-transition-duration: 0.2s;
  -webkit-transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
  -moz-transition-duration: 0.2s;
  -moz-transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
}

/* --------------------------------------- guidance */
.guidance {
  text-align: center;
  margin-top: 2.9282576867vw;
  margin-bottom: 1.4641288433vw;
}
.guidance a {
  display: inline-block;
  font-size: 16px;
  font-size: 1.1713030747vw;
  line-height: 2.3;
  height: auto;
  text-decoration: underline;
}

/* ================================================ loginNav */
.loginNav__title {
  font-size: 27px;
  font-size: 1.9765739385vw;
  line-height: 1;
  margin-bottom: 0.7320644217vw;
}

.loginNav__text {
  font-size: 16px;
  font-size: 1.1713030747vw;
  margin-bottom: 1.4641288433vw;
}

/* --------------------------------------- newUser__loginBtn */
.newUser__loginBtn--link {
  height: 5.8565153734vw;
  font-size: 24px;
  font-size: 1.756954612vw;
  text-align: center;
  line-height: 5.8565153734vw;
  background-color: #fff;
  border-radius: 0.7320644217vw;
  border-width: 2px;
  border-style: solid;
  border-color: #fff;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
  -ms-transition-duration: 0.2s;
  -ms-transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
  -webkit-transition-duration: 0.2s;
  -webkit-transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
  -moz-transition-duration: 0.2s;
  -moz-transition-timing-function: cubic-bezier(0.4, 0.4, 0, 1);
}

/* ============================================================================================ hover pc */
@media (hover: hover) and (pointer: fine) {
  .sendBtn__inner:hover, .sendBtn__inner:active {
    border-color: rgba(var(--color-text), 1);
  }
  .guidance a:hover, .guidance a:active {
    text-decoration: none;
  }
  .newUser__loginBtn--link:hover, .newUser__loginBtn--link:active {
    color: #fff;
    background-color: rgba(var(--color-text), 1);
  }
}
/* ============================================================================================ hover pc */
/* --------------------------------------- blockHover__thumImg */
@media (hover: hover) and (pointer: fine) {
  .login .fixedBtn.fixedBtn__account .btnHover:hover .fixedBtn__text::after, .login .fixedBtn.fixedBtn__account .btnHover:active .fixedBtn__text::after {
    color: #fff;
  }
}/*# sourceMappingURL=login.css.map */