nav .input-field {
    margin: 0; }
    nav .input-field input {
      height: 100%;
      font-size: 1.2rem;
      border: none;
      padding-left: 2rem; }
      nav .input-field input:focus, nav .input-field input[type=text]:valid, nav .input-field input[type=password]:valid, nav .input-field input[type=email]:valid, nav .input-field input[type=url]:valid, nav .input-field input[type=date]:valid {
        border: none;
        box-shadow: none; }
    nav .input-field label {
      top: 0;
      left: 0; }
      nav .input-field label i {
        color: rgba(255, 255, 255, 0.7);
        -webkit-transition: color .3s;
        -moz-transition: color .3s;
        -o-transition: color .3s;
        -ms-transition: color .3s;
        transition: color .3s; }
      nav .input-field label.active i {
        color: #fff; }
      nav .input-field label.active {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0); }
.input-field {
  position: relative;
  margin: 1rem 15px 0 15px;
}
  .input-field label {
    color: #9e9e9e;
    position: absolute;
    top: 0.8rem;
    left: 0.75rem;
    font-size: 1.5rem;
    cursor: text;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    -o-transition: .2s ease-out;
    -ms-transition: .2s ease-out;
    transition: .2s ease-out; }
  .input-field label.active {
    font-size: 1rem;
    -webkit-transform: translateY(-140%);
    -moz-transform: translateY(-140%);
    -ms-transform: translateY(-140%);
    -o-transform: translateY(-140%);
    transform: translateY(-140%); }
  .input-field .prefix {
    position: absolute;
    width: 3rem;
    font-size: 2rem;
    -webkit-transition: color .2s;
    -moz-transition: color .2s;
    -o-transition: color .2s;
    -ms-transition: color .2s;
    transition: color .2s; }
    .input-field .prefix.active {
      color: #2195C3; }
  .input-field .prefix ~ input, .input-field .prefix ~ textarea {
    margin-left: 3rem;
    width: 92%;
    width: calc(100% - 3rem); }
  .input-field .prefix ~ textarea {
    padding-top: .8rem; }
  .input-field .prefix ~ label {
    margin-left: 3rem; }
  @media only screen and (max-width : 992px) {
    .input-field .prefix ~ input {
      width: 86%;
      width: calc(100% - 3rem); } }
  @media only screen and (max-width : 600px) {
    .input-field .prefix ~ input {
      width: 80%; } }

.input-field input[type=search] {
  display: block;
  line-height: inherit;
  padding-left: 4rem;
  width: calc(100% - 4rem); }
  .input-field input[type=search]:focus {
    background-color: #fff;
    border: 0;
    box-shadow: none;
    color: #444; }
    .input-field input[type=search]:focus + label i, .input-field input[type=search]:focus ~ .mdi-navigation-close {
      color: #444; }
  .input-field input[type=search] + label {
    left: 1rem; }
  .input-field input[type=search] ~ .mdi-navigation-close {
    position: absolute;
    top: 0;
    right: 1rem;
    color: transparent;
    cursor: pointer;
    font-size: 2rem;
    transition: .3s color; }
/* Remove Focus Boxes */
select:focus {
  outline: 1px solid #c9f3ef; }

button:focus {
  outline: none;
  background-color: #2ab7a9; }

/***************************
   Text Inputs + Textarea
****************************/
::-webkit-input-placeholder {
  color: #d1d1d1; }

:-moz-placeholder {
  /* Firefox 18- */
  color: #d1d1d1; }

::-moz-placeholder {
  /* Firefox 19+ */
  color: #d1d1d1; }

:-ms-input-placeholder {
  color: #d1d1d1; }

input[type=text], input[type=password], input[type=email], input[type=url], input[type=time], input[type=date], input[type=datetime-local], input[type=tel], input[type=number], input[type=search], textarea.materialize-textarea {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #9e9e9e;
  border-radius: 0;
  outline: none;
  height: 3rem;
  width: 100%;
  font-size: 16px;
  margin: 0 0 15px 0;
  padding: 0;
  box-shadow: none;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  transition: all .3s; }
  input[type=text]:disabled, input[type=text][readonly="readonly"], input[type=password]:disabled, input[type=password][readonly="readonly"], input[type=email]:disabled, input[type=email][readonly="readonly"], input[type=url]:disabled, input[type=url][readonly="readonly"], input[type=time]:disabled, input[type=time][readonly="readonly"], input[type=date]:disabled, input[type=date][readonly="readonly"], input[type=datetime-local]:disabled, input[type=datetime-local][readonly="readonly"], input[type=tel]:disabled, input[type=tel][readonly="readonly"], input[type=number]:disabled, input[type=number][readonly="readonly"], input[type=search]:disabled, input[type=search][readonly="readonly"], textarea.materialize-textarea:disabled, textarea.materialize-textarea[readonly="readonly"] {
    color: rgba(0, 0, 0, 0.26);
    border-bottom: 1px dotted rgba(0, 0, 0, 0.26); }
  input[type=text]:disabled + label, input[type=text][readonly="readonly"] + label, input[type=password]:disabled + label, input[type=password][readonly="readonly"] + label, input[type=email]:disabled + label, input[type=email][readonly="readonly"] + label, input[type=url]:disabled + label, input[type=url][readonly="readonly"] + label, input[type=time]:disabled + label, input[type=time][readonly="readonly"] + label, input[type=date]:disabled + label, input[type=date][readonly="readonly"] + label, input[type=datetime-local]:disabled + label, input[type=datetime-local][readonly="readonly"] + label, input[type=tel]:disabled + label, input[type=tel][readonly="readonly"] + label, input[type=number]:disabled + label, input[type=number][readonly="readonly"] + label, input[type=search]:disabled + label, input[type=search][readonly="readonly"] + label, textarea.materialize-textarea:disabled + label, textarea.materialize-textarea[readonly="readonly"] + label {
    color: rgba(0, 0, 0, 0.26); }
  input[type=text]:focus:not([readonly]), input[type=password]:focus:not([readonly]), input[type=email]:focus:not([readonly]), input[type=url]:focus:not([readonly]), input[type=time]:focus:not([readonly]), input[type=date]:focus:not([readonly]), input[type=datetime-local]:focus:not([readonly]), input[type=tel]:focus:not([readonly]), input[type=number]:focus:not([readonly]), input[type=search]:focus:not([readonly]), textarea.materialize-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #2195C3;
    box-shadow: 0 1px 0 0 #2195C3; }
  input[type=text]:focus:not([readonly]) + label, input[type=password]:focus:not([readonly]) + label, input[type=email]:focus:not([readonly]) + label, input[type=url]:focus:not([readonly]) + label, input[type=time]:focus:not([readonly]) + label, input[type=date]:focus:not([readonly]) + label, input[type=datetime-local]:focus:not([readonly]) + label, input[type=tel]:focus:not([readonly]) + label, input[type=number]:focus:not([readonly]) + label, input[type=search]:focus:not([readonly]) + label, textarea.materialize-textarea:focus:not([readonly]) + label {
    color: #2195C3; }
  input[type=text].valid, input[type=text]:focus.valid, input[type=password].valid, input[type=password]:focus.valid, input[type=email].valid, input[type=email]:focus.valid, input[type=url].valid, input[type=url]:focus.valid, input[type=time].valid, input[type=time]:focus.valid, input[type=date].valid, input[type=date]:focus.valid, input[type=datetime-local].valid, input[type=datetime-local]:focus.valid, input[type=tel].valid, input[type=tel]:focus.valid, input[type=number].valid, input[type=number]:focus.valid, input[type=search].valid, input[type=search]:focus.valid, textarea.materialize-textarea.valid, textarea.materialize-textarea:focus.valid {
    border-bottom: 1px solid #4CAF50;
    box-shadow: 0 1px 0 0 #4CAF50; }
  input[type=text].valid + label:after, input[type=text]:focus.valid + label:after, input[type=password].valid + label:after, input[type=password]:focus.valid + label:after, input[type=email].valid + label:after, input[type=email]:focus.valid + label:after, input[type=url].valid + label:after, input[type=url]:focus.valid + label:after, input[type=time].valid + label:after, input[type=time]:focus.valid + label:after, input[type=date].valid + label:after, input[type=date]:focus.valid + label:after, input[type=datetime-local].valid + label:after, input[type=datetime-local]:focus.valid + label:after, input[type=tel].valid + label:after, input[type=tel]:focus.valid + label:after, input[type=number].valid + label:after, input[type=number]:focus.valid + label:after, input[type=search].valid + label:after, input[type=search]:focus.valid + label:after, textarea.materialize-textarea.valid + label:after, textarea.materialize-textarea:focus.valid + label:after {
    content: attr(data-success);
    color: #4CAF50;
    opacity: 1; }
  input[type=text].invalid, input[type=text]:focus.invalid, input[type=password].invalid, input[type=password]:focus.invalid, input[type=email].invalid, input[type=email]:focus.invalid, input[type=url].invalid, input[type=url]:focus.invalid, input[type=time].invalid, input[type=time]:focus.invalid, input[type=date].invalid, input[type=date]:focus.invalid, input[type=datetime-local].invalid, input[type=datetime-local]:focus.invalid, input[type=tel].invalid, input[type=tel]:focus.invalid, input[type=number].invalid, input[type=number]:focus.invalid, input[type=search].invalid, input[type=search]:focus.invalid, textarea.materialize-textarea.invalid, textarea.materialize-textarea:focus.invalid {
    border-bottom: 1px solid #F44336;
    box-shadow: 0 1px 0 0 #F44336; }
  input[type=text].invalid + label:after, input[type=text]:focus.invalid + label:after, input[type=password].invalid + label:after, input[type=password]:focus.invalid + label:after, input[type=email].invalid + label:after, input[type=email]:focus.invalid + label:after, input[type=url].invalid + label:after, input[type=url]:focus.invalid + label:after, input[type=time].invalid + label:after, input[type=time]:focus.invalid + label:after, input[type=date].invalid + label:after, input[type=date]:focus.invalid + label:after, input[type=datetime-local].invalid + label:after, input[type=datetime-local]:focus.invalid + label:after, input[type=tel].invalid + label:after, input[type=tel]:focus.invalid + label:after, input[type=number].invalid + label:after, input[type=number]:focus.invalid + label:after, input[type=search].invalid + label:after, input[type=search]:focus.invalid + label:after, textarea.materialize-textarea.invalid + label:after, textarea.materialize-textarea:focus.invalid + label:after {
    content: attr(data-error);
    color: #F44336;
    opacity: 1; }
  input[type=text] + label:after, input[type=password] + label:after, input[type=email] + label:after, input[type=url] + label:after, input[type=time] + label:after, input[type=date] + label:after, input[type=datetime-local] + label:after, input[type=tel] + label:after, input[type=number] + label:after, input[type=search] + label:after, textarea.materialize-textarea + label:after {
    display: block;
    content: "";
    position: absolute;
    top: 65px;
    opacity: 0;
    transition: .2s opacity ease-out, .2s color ease-out; }
textarea {
  width: 100%;
  height: 3rem;
  border-top: none;
  border-left: none;
	border-right: none;
	border-bottom: 1px solid #9e9e9e;
  background-color: transparent; }

textarea:focus {
border-bottom: 1px solid #2195C3;
    box-shadow: 0 1px 0 0 #2195C3;}

  textarea.materialize-textarea {
    overflow-y: hidden;
    /* prevents scroll bar flash */
    padding: 1.6rem 0;
    /* prevents text jump on Enter keypress */
    resize: none;
    min-height: 3rem; }

/* ======== JavaScript 入力不備エラー  ============ */
#ERROR_background {
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}
#ERROR_box{
	background-color:#FFBFBF;
	width:90%;
	color: #f00;
	z-index: 5000;
	margin: 5px auto 15px auto;
	clear: both;
	text-align: center;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
#ERROR_message {
	display:inline-block;
	background-color:#FFBFBF;
	padding:10px;
	color:#ff0000;
}

#ERROR_message ul {
	text-align:left;
	font-size: 84%;
	margin-left: -15px;
}
.error_box {
	padding:5px 0;
	color: #FF26FF;
	font-size: 90%;
}

.iflabel {
    color: #9e9e9e;
    padding-left: 0.75rem;
    font-size: 1.5rem;
    cursor: text;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    -o-transition: .2s ease-out;
    -ms-transition: .2s ease-out;
    transition: .2s ease-out; }
.iflabel i {
        color: #9E9E9E;
        -webkit-transition: color .3s;
        -moz-transition: color .3s;
        -o-transition: color .3s;
        -ms-transition: color .3s;
        transition: color .3s; }
.iflabel.active i {
        color: #fff; }
.iflabel.active {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0); }
.forminconf{
	border-bottom: 1px solid #666;
	margin:-15px 0 10px 0;
	padding:0 0 3px 15px;;
}
/* ============= メッセージを表示する画面  ================ */
.messageouter {
	border:dotted 1px #444444;
	margin:0 20px 0 20px;
	padding:20px 0 20px 0;
	text-align:center;
}

.message {
	display:inline-block;
	color: #f00;
	font-weight: 700;
	min-height: 150px;
}

.messageouter .message ul {
	list-style-position:inside;
	margin:0 5px 0 5px;
}

.red-text{color: #f00;}