article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}

*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content:''; display:table; }
.clearfix:after { clear:both; }

.content_form {
  font-size:150%;
}

.input {
  position:relative;
  z-index:1;
  display:inline-block;
  max-width:350px;
  width:calc(100% - 2em);
  vertical-align:top;
}

.input_long {
  position:relative;
  z-index:1;
  display:inline-block;
  max-width:100%;
  width:calc(100% - 2em);
  vertical-align:top;
}

.input__field {
  position:relative;
  display:block;
  float:right;
  padding:0.8em;
  width:60%;
  border:none;
  border-radius:0;
  background:#F0F0F0;
  color:#AAA;
  font-weight:bold;
  text-align:left;
  -webkit-appearance:none; /* for box shadows to show on iOS */
}

.input__field:focus {
  outline:none;
}

.input__label {
  display:inline-block;
  float:right;
  padding:0 1em;
  width:40%;
  color:#6A7989;
  font-weight:bold;
  font-size:70.25%;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -khtml-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
}

.input__label-content {
  position:relative;
  display:block;
  padding:1.6em 0;
  width:100%;
}

.input--hoshi {
  overflow:hidden;
}

.input__field--hoshi {
  margin-top:1em;
  padding:0.85em 0.15em;
  width:100%;
  background:transparent;
  color:#595F6E;
}

.input__label--hoshi {
  position:absolute;
  bottom:0;
  left:0;
  padding:0 0.25em;
  width:100%;
  height:calc(100% - 1em);
  text-align:left;
  pointer-events:none;
}

.input__label-content--hoshi {
  position:absolute;
}

.input__label--hoshi::before,
.input__label--hoshi::after {
  content:'';
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:calc(100% - 10px);
  border-bottom:1px solid #B9C1CA;
}

.input__label--hoshi::after {
  margin-top:2px;
  border-bottom:4px solid red;
  -webkit-transform:translate3d(-100%, 0, 0);
  transform:translate3d(-100%, 0, 0);
  -webkit-transition:-webkit-transform 0.3s;
  transition:transform 0.3s;
}

.input__label--hoshi-color::after {
  border-color:hsl(160, 100%, 50%);
}

.input__field--hoshi:focus + .input__label--hoshi::after,
.input--filled .input__label--hoshi::after {
  -webkit-transform:translate3d(0, 0, 0);
  transform:translate3d(0, 0, 0);
}

.input__field--hoshi:focus + .input__label--hoshi .input__label-content--hoshi,
.input--filled .input__label-content--hoshi {
  -webkit-animation:anim-1 0.3s forwards;
  animation:anim-1 0.3s forwards;
}

@-webkit-keyframes anim-1 {
  50% {
    opacity:0;
    -webkit-transform:translate3d(1em, 0, 0);
    transform:translate3d(1em, 0, 0);
  }
  51% {
    opacity:0;
    -webkit-transform:translate3d(-1em, -40%, 0);
    transform:translate3d(-1em, -40%, 0);
  }
  100% {
  opacity:1;
  -webkit-transform:translate3d(0, -40%, 0);
  transform:translate3d(0, -40%, 0);
  }
}

@keyframes anim-1 {
  50% {
  opacity:0;
  -webkit-transform:translate3d(1em, 0, 0);
  transform:translate3d(1em, 0, 0);
  }
  51% {
    opacity:0;
    -webkit-transform:translate3d(-1em, -40%, 0);
    transform:translate3d(-1em, -40%, 0);
  }
  100% {
    opacity:1;
    -webkit-transform:translate3d(0, -40%, 0);
    transform:translate3d(0, -40%, 0);
  }
}