@charset "UTF-8";

/*	title
----------------------------------------------- */

#inquiry #title {
  padding: 50px 0 25px 0;
  border-bottom: 3px solid #f08300;
}

#inquiry #title h2 {
  font-size: 1.5em;
  width: 1000px;
  margin: 0 auto;
}

#inquiry #title h2 span {
  color: #f08300;;
  font-weight: bold;
  font-size: 0.6em;
}








/* ----------------------------------------------------------------------------------------------------



	mailform



--------------------------------------------------- */

#mailform { margin-top: 50px; }

	#mailform .mf-box {
		background: #006cb5;
		display: table;
		margin: 0 0 15px;
		overflow: hidden;
		width: 100%;
		}

	#mailform .mf-box .mfb-ttl {
		color: #fff;
		display: table-cell;
		font-size: 15px;
		font-weight: bold;
		line-height: 1.5em;
		height: 100%;
		position: relative;
		text-align: left;
		vertical-align: middle;
		width: 20%;
	    padding: 20px;
		}
		#mailform .mf-box .mfb-ttl span.label-required,
		#mailform .mf-box .mfb-ttl span.label-any {
			border: 1px solid #fff;
			color: #ec0000;
			display: inline-block;
			font-size: 13px;
			margin: 10px 0 0 0;
			padding: 1px 10px;
			}
		#mailform .mf-box .mfb-ttl span.label-required {
			border: 1px solid #ec0000;
			background: #ffffff;
			}
		#mailform .mf-box .mfb-ttl span.label-any { background: #999; }

	#mailform .mf-box .mfb-inner {
		background: #e9e9e9;
		display: table-cell;
		float: left;
		font-size: 14px;
		padding: 20px 30px 5px;
		width: 100%;
		}

	#mailform .mf-box .mfb-inner .mfbi-ttl {
		background: #908f8f;
		color: #fff;
		margin: 0 0 15px;
		padding: 2px 20px 0;

		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
		border-radius: 30px;
		}
	#mailform .mf-box .mfb-inner .mfbi-sub-ttl {
		font-weight: bold;
		padding: 1em 0;
		}
		#mailform .mf-box .mfb-inner .mfbi-sub-ttl span {
			font-weight: normal;
			}
	#mailform .mf-box .mfb-inner .mfbi-info { margin-bottom: 15px; }
		#mailform .mf-box .mfb-inner .mfbi-info small { font-size: 11px; }

	#mailform .mf-box .mfb-inner dl {
		margin: 0 0 15px;
		overflow: hidden;
		}
		#mailform .mf-box .mfb-inner dl dt {
			float: left;
    	padding: 10px 0 0;
			width: 200px;
			}
		#mailform .mf-box .mfb-inner dl.content dt {
			padding: 60px 0 0;
			}
		#mailform .mf-box .mfb-inner dl dd {
			margin: 0;
			padding: 0 0 0 200px;
			width: 100%;
			}

	#mailform .mfb-inner .txterror,
	#mailform #info-submit .txterror {
		color: #ff0000;
		display: block !important;
		}

	/* parts
	----------------------------------------------- */
	#mailform #open-other-form {
		text-align: center;
		margin-top: 45px;
	}
	#mailform #open-other-form p {

	}
	#mailform #open-other-form #anyform-open-button {
		display: inline-block;
		position: relative;
		color: #ffffff;
		font-size: 18px;
		background-color: #006cb5;
		border: none;
		margin-top: 20px;
		padding: 8px 70px 8px 90px;
		-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
		-ms-border-radius: 20px;
		-o-border-radius: 20px;
		border-radius: 20px;
	}
	#mailform #open-other-form #anyform-open-button span {
		position: absolute;
    font-size: 15px;
    left: 20px;
    top: 7px;
    display: inline-block;
    padding: 2px 5px;
    color: #595858;
    border: 1px solid #595858;
    background: #ffffff;
	}
	#mailform #open-other-form #anyform-open-button.open::after {
		position: absolute;
    content: url(/lib/img/mailform/form_open.png);
    width: 20px;
    height: 20px;
    display: block;
    right: 15px;
    top: 5px;
		}
    #mailform #open-other-form #anyform-open-button.close::after {
  		position: absolute;
      content: url(/lib/img/mailform/form_close.png);
      width: 20px;
      height: 20px;
      display: block;
      right: 15px;
      top: 5px;
  		}
	#mailform #open-other-form #anyform-open-button:hover {
			cursor: pointer;
		}

	#mailform #info-privacy,
	#mailform #info-submit { background: #fff; }

	#mailform .mf-box .mfb-inner dl .dn { display: none; }
	#mailform .mf-box .mfb-inner dl .pn {
		padding: 0;
		width: 100%;
		}

	#mailform #info-current .mfb-inner .check-wrap div {
    display: inline-block;
		margin: 15px 10px 20px 0;
		width: 45%;
		}
		#mailform #info-current .mfb-inner .check-wrap div:nth-last-of-type(1) {
			margin-top: 0;
		}
    #mailform #info-current .mfb-inner .check-wrap div:nth-last-of-type(1) input {
      width: 55%;
      margin-left: 10px;
    }
		#mailform #info-current .mfb-inner .mfbi-sub-ttl:nth-of-type(1) {
			padding-top: 0;
		}
		#mailform #info-current .mfb-inner .mfbi-sub-ttl:nth-of-type(2) ,
		#mailform #info-current .mfb-inner .mfbi-sub-ttl:nth-of-type(3) {
			margin-top: 25px;
		}


	#mailform #info-etc { margin: 0 0 5px; }
	#mailform #info-etc .mfb-inner { padding: 20px 30px 10px; }

	#mailform #info-system .mfb-inner dl .pn div {
	    display: inline-block;
	    margin: 10px 15px 10px 0;
		}
		#mailform #info-system .mfbi-sub-ttl:nth-of-type(1) { padding-top: 0; }
		#mailform #info-system .mfb-inner dl .pn div:nth-child(2) { width: 600px; }
		#mailform #info-system .mfb-inner dl .pn div:last-child { display: block; }

	#mailform #info-organization .mfb-inner dl dd div {
		display: inline-block;
		margin: 10px 15px 10px 0;
		}

	#mailform #info-privacy {
		padding-top: 55px;
		margin-top: 65px;
		border-top: 1px solid #908f8f;
	}

	#mailform #info-privacy p {
		display: inline-block;
		font-size: 12.5px;
		letter-spacing: 0;
		padding: 10px 0 0;
		}
		#mailform #info-privacy .privacy_btn {
			float: right;
			background-color: #fca036;
			font-size: 80%;
	    padding: 0.5em 0em;
	    width: 160px;
	    background-color: #fca036;
	    -webkit-border-radius: 20px;
	    -moz-border-radius: 20px;
	    -ms-border-radius: 20px;
	    -o-border-radius: 20px;
	    border-radius: 20px;
	    text-align: center;
	    display: table;
	    margin: 3px 0 0 20px;
			}
			#mailform #info-privacy .privacy_btn a {
				color: #ffffff;
				}

	#mailform #info-submit {
		margin-top: 25px;
		text-align: center;
		padding: 10px 0;
		}
		#mailform #info-submit div { margin: 0 auto; }

	.submitBtn {
		text-align: center;
		margin-top: 30px;
		margin-bottom: 120px;
	  }
		.submitBtn input {
			color: #fff;
			cursor: pointer;
			display: inline-block;
			margin: 0 10px;
			padding: 10px 50px;
			text-align: center;
			width: 230px;
			}
		.submitBtn #send {
			background: #0269b6;
			border-bottom: 2px solid #002341;
			}
			.submitBtn #send.no-click {
				background: #b3d2e9;
				border-bottom: 2px solid #b2c0cb;
				box-shadow: none;
				}
		.submitBtn #reset {
			background: #908f8f;
			border-bottom: 2px solid #646464;
			}

	#mailform .closed-form {
		visibility: hidden;
    overflow: hidden;
		height: 0;
		opacity: 0;
		transition: .5s;
	}

	#mailform .opened-form {
		visibility: visible;
		height: 100%;
		opacity: 1.0;
		transition: 1s;
    margin-top: 45px;
	}


	/* module
	----------------------------------------------- */
	input {
		border: none;
		display: inline-block;
		outline: none;
		padding: 10px 3%;

		-webkit-box-shadow: 1px 1px 0 #aaa inset;
		-moz-box-shadow: 1px 1px 0 #aaa inset;
		box-shadow: 1px 1px 0 #aaa inset;
		}
		label {
		    vertical-align: middle;
		    height: 40px;
		    padding: 10px 0 10px 40px;
		    width: 40px;
			}

		input[type="checkbox"],
		input[type="radio"] {
			display: none;
			}

		input[type="checkbox"] + label,
		input[type="radio"] + label {
			background-image: url(/lib/img/mailform/bg-input-check.png);
			background-position: left center;
			background-repeat: no-repeat;
			cursor: pointer;
			}
		input[type="checkbox"]:checked + label,
		input[type="radio"]:checked + label {
			background-image: url(/lib/img/mailform/bg-input-check-on.png);
			background-position: left center;
			background-repeat: no-repeat;
			cursor: pointer;
			}

		label.system_yn { padding: 10px 40px 10px 0; }
			input[type="checkbox"] + label.system_yn,
			input[type="radio"] + label.system_yn,
			input[type="checkbox"]:checked + label.system_yn,
			input[type="radio"]:checked + label.system_yn { background-position: right center; }

		label#id_etc { padding: 10px; }

		input.inp-taw100p { width: 100%; }
		input.inp-tawMid { width: 400px; }
		input.inp-tawMid2 { width: 530px; }

		input.right-align { text-align: right; }

		/*input[type="text"] { color: #ccc; }*/
		input::-webkit-input-placeholder { color: #ccc; }
		input:-ms-input-placeholder { color: #ccc; }
		input::-moz-placeholder { color: #ccc; }

	label {}

	textarea {
		width: 100%;
		height: 150px;
		padding: 10px 3%;
	}


	/* confirm
	----------------------------------------------- */
	#f_confirm .mf-box .mfb-inner dl dt { padding: 0; }
	#f_confirm .mf-box .mfb-inner dl dd p { color: #333; }

	#f_confirm #info-customer .mfb-ttl,
	#f_confirm #info-current .mfb-ttl,
	#f_confirm #info-organization .mfb-ttl,
	#f_confirm #info-system .mfb-ttl,
	#f_confirm #info-etc .mfb-ttl { padding: 20px 20px 0; }

  #f_confirm #info-current dl.route dd { padding: 0; }
  #f_confirm #info-current dl.route dt { display: none; }
  #f_confirm #info-current dl.route dd p {
    display: inline-block;
    margin:  2px 15px 2px 0px;
  }

	#f_confirm .submitBtn { padding: 30px 0 0; }
	#f_confirm .submitBtn #back {
		background: #908f8f;
		border-bottom: 2px solid #646464;
		}
	#f_confirm #info-etc .mfb-inner { padding: 20px 30px; }

  #f_confirm #info-system .system-name { margin-top: 10px; }

	#f_confirm #info-submit .txterror p,
	#f_confirm .mfb-inner .txterror p { color: #e43826; }


	/* thanks
	----------------------------------------------- */
	#f_thanks {
    text-align: center;
    line-height: 1.8em;
    padding: 10px 0 100px 0;
  }
	#f_thanks h3 {
		font-size: 26px;
		padding: 0 0 20px;
		color: #333;
		}
	#f_thanks p {}
		#f_thanks p a {
			color: #238BE6;
			display: inline-block;
			font-weight: bold;
			padding: 0 5px;
			}


/* mediaquery max-width 640px
-------------------------------------------------------------------- */
@media screen and (max-width: 640px)  {
  #inquiry #title h2 {
    text-align: center;
    font-size: 1.8em;
    line-height: 1.2em;
    width: 640px;
  }

  #mailform .mf-box {
    display: inherit;
  }
  #mailform .mf-box .mfb-ttl br {
    display: none;
  }
  #mailform .mf-box .mfb-ttl span.label-required {
    margin-left: 10px;
  }

  #mailform #info-privacy p {
    font-size: 1em;
    line-height: 1.5em;
    padding: 10px 20px 0 20px;
  }

  #mailform #info-privacy .privacy_btn {
    float: none;
    margin: 10px auto 0 auto;
  }
}