/* fonts */
/*@font-face {
	font-family: "Source Han Sans JP";
	src: url("../fonts/SourceHanSans-Regular.otf") format("opentype");
	font-display: swap;
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "Source Han Sans JP";
	src: url("../fonts/SourceHanSans-Medium.otf") format("opentype");
	font-display: swap;
	font-weight: bold;
	font-style: normal;
}*/
/* colors */
/*skew*/
/*text*/
/*borders*/
/*LP*/
#lp #logo {
  margin: 4vh 8vh;
  display: inline-block; }
  #lp #logo img {
    max-width: 250px; }
#lp .sticky {
  background: #fef8cc;
  padding: 30px 0 0;
  margin: 0 -15px;
  margin-top: -100px; }
#lp .container {
  margin: 100px 0; }
  #lp .container img {
    max-width: 100%;
    margin-bottom: 50px; }
#lp #skew-container {
  margin-top: -135px;
  margin-bottom: 100px;
  position: relative;
  color: #fff;
  margin-left: -28px !important;
  padding: 0; }
  #lp #skew-container .content {
    padding: 10vh 10vh 10vh 0; }
#lp #steps .row {
  background: #6a2c91;
  background: -moz-linear-gradient(-45deg, #6a2c91 0%, #8d288f 30%, #653190 61%, #196bb3 100%);
  background: -webkit-linear-gradient(-45deg, #6a2c91 0%, #8d288f 30%, #653190 61%, #196bb3 100%);
  background: linear-gradient(135deg, #6a2c91 0%, #8d288f 30%, #653190 61%, #196bb3 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6a2c91', endColorstr='#196bb3', GradientType=1);
  transform: skew(-2deg);
  padding: 30px; }
#lp #steps .card {
  border: none;
  padding: 0;
  border-radius: 0;
  color: #fff;
  background: none; }
#lp #evp h2 {
  margin-bottom: 50px; }
#lp .cta-banner {
  margin-top: 50px; }
  #lp .cta-banner p {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: bold; }
#lp .jumbotron-fluid {
  height: 50vh;
  overflow: hidden;
  margin-top: -1px;
  background: url("../img/recruitment-main2.png") no-repeat #000;
  background-size: cover;
  background-position: 0 -40px;
  min-height: 450px;
  position: relative; }
  #lp .jumbotron-fluid::after {
    content: "";
    font-size: 10vw;
    display: block;
    width: 100%;
    position: absolute;
    bottom: -17px;
    opacity: 0.7;
    font-weight: 900;
    z-index: 2;
    color: #fff;
    letter-spacing: -0.5vw;
    right: 9px;
    content: "Careers";
    font-family: Helvetica, Arial, sans-serif; }
  #lp .jumbotron-fluid .white-txt {
    font-size: 31px;
    max-width: 48%;
    display: block;
    margin: 10vw 5vw 0 52%;
    text-decoration: underline; }
#lp .join.jumbotron-fluid::after {
  content: "";
  font-size: 10vw;
  display: block;
  width: 100%;
  position: absolute;
  bottom: -17px;
  opacity: 0.7;
  font-weight: 900;
  z-index: 2;
  color: #fff;
  letter-spacing: -0.5vw;
  right: 9px;
  content: "Cognitive Careers";
  width: 50%;
  right: auto;
  left: 9px;
  line-height: 9vw;
  text-align: left; }
#lp #main-list li {
  margin-bottom: 50px;
  border-right: 1px solid purple; }
  #lp #main-list li:last-child {
    border-right: none; }
#lp .skew {
  padding: 30px 15px 30px 50px; }

/*form*/
/*form styles*/
#msform {
  position: relative; }

#msform fieldset {
  width: 100%; }

/*Hide all except first fieldset*/
#msform fieldset:not(:first-of-type) {
  display: none; }

#form {
  background: #fef8cc; }
  #form form {
    background: #fef8cc;
    padding: 0 20px;
    margin-bottom: 50px; }
  #form .form-stages {
    display: none;
    margin-top: 45px; }
    #form .form-stages.show {
      display: block; }
  #form .container {
    margin: 0;
    padding: 10px 0 0; }
  #form h2 {
    text-align: center;
    margin-top: 25px; }
  #form h3 {
    text-align: center;
    text-transform: none;
    font-size: 1.5rem;
    margin: 20px 0;
    font-weight: bold;
    border-top: 1px solid #ded8ac;
    padding-top: 25px; }
  #form h4 {
    margin-bottom: 10px; }
  #form #stage2 .form-row {
    margin-bottom: 10px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 5px; }
  #form .dates-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 10px; }
  #form .button-row {
    display: grid;
    grid-template-columns: 1fr 3fr;
    grid-gap: 10px;
    border-top: 1px dotted #333;
    margin-top: 25px;
    padding: 15px 0; }
    #form .button-row p {
      display: grid;
      grid-template-columns: 1fr 2fr;
      grid-gap: 10px; }
  #form #stage1 .button-row {
    grid-template-columns: 1fr 4fr; }
  #form .stage-indicator {
    line-height: 3.75rem; }
  #form .btn {
    width: 100%;
    margin: 10px 0;
    border-radius: 5px;
    cursor: pointer;
    border-color: #d2d2d2; }
  #form .cover-letter,
  #form .privacy {
    margin-top: 25px; }
  #form input[type="file"] {
    border: none;
    background: #f2ecc0; }

.cta {
  background: #f75e1f;
  border: none;
  width: 100%;
  margin: 10px 0;
  color: #fff;
  font-weight: 700;
  text-transform: uppercase; }
  .cta:hover {
    background: #F87E4B;
    color: #fff; }

.cta-next {
  background: purple;
  color: #fff;
  border: none;
  width: 100%;
  margin: 10px 0;
  font-weight: 700;
  text-transform: uppercase; }
  .cta-next:hover {
    color: #fff;
    background: #493690; }

.step {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbbbbb;
  border: none;
  border-radius: 50%;
  display: inline-block;
  opacity: 0.5; }

.step.active {
  opacity: 1; }

.step.finish {
  background-color: purple; }

.submit-btn {
  background: purple;
  color: #fff; }

/*RESP.*/
@media (max-width: 1024px) {
  #lp .sticky {
    margin-top: 25px; }

  #lp .jumbotron-fluid {
    background-position: center; }
    #lp .jumbotron-fluid::after {
      bottom: 24px; }

  #lp .container {
    max-width: 100%; }

  #lp #skew-container {
    margin-top: -117px;
    margin-left: -30px !important; } }
@media (max-width: 768px) {
  #lp #main-list li {
    border-right: none;
    margin-bottom: 25px; }

  #lp .jumbotron-fluid .white-txt {
    font-size: 1.5rem;
    max-width: 48%;
    display: block;
    margin: 10vw 5vw 0 52%;
    text-decoration: underline; }

  #lp #steps .row {
    background: none;
    filter: none;
    padding: 0;
    transform: skew(0deg); }

  #lp .container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 50px 0; }

  #lp .container#skew-container {
    margin-top: -25px; }
    #lp .container#skew-container .content {
      padding: 4vh 10vh 4vh 0; }
      #lp .container#skew-container .content .title {
        font-size: 1.875rem; }

  #lp iframe {
    margin-top: 0; }

  #lp .jumbotron-fluid {
    min-height: 200px; }
    #lp .jumbotron-fluid .white-txt {
      font-size: 1.5rem;
      max-width: 48%;
      display: block;
      margin: 10vw 5vw 0 52%;
      text-decoration: underline; }
    #lp .jumbotron-fluid::after {
      bottom: -25px; }

  #lp #steps .card {
    background: #6a2c91;
    background: -moz-linear-gradient(-45deg, #6a2c91 0%, #8d288f 30%, #653190 61%, #196bb3 100%);
    background: -webkit-linear-gradient(-45deg, #6a2c91 0%, #8d288f 30%, #653190 61%, #196bb3 100%);
    background: linear-gradient(135deg, #6a2c91 0%, #8d288f 30%, #653190 61%, #196bb3 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6a2c91', endColorstr='#196bb3', GradientType=1);
    margin-bottom: 10px; } }
@media (max-width: 500px) {
  #lp .jumbotron-fluid {
    min-height: 250px;
    height: auto;
    background-position: center; }
    #lp .jumbotron-fluid::after {
      display: none; }

  #lp .container#skew-container {
    margin-top: -100px; }

  #lp #logo {
    margin: 1vh 4vw;
    display: inline-block; }

  #lp #skew-container .content {
    padding: 2vh 1vh 2vh 0; } }
/*# sourceMappingURL=styles.css.map */

/*# sourceMappingURL=lp-styles.css.map */