@charset "UTF-8";

#header {
	padding: 30px 30px;
}

#main {
	box-sizing: border-box;
	padding: 20px 30px 30px;
	/*min-width: 862px;*/
}

.txtarea {
	margin: 0 0 20px;
}

.ph img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
	_width: 100%;
}

/* ボックス */
.note_block {
	clear: both;
	padding: 15px;
	border: solid 1px #CCCCCC;
	height: 200px;
	overflow: scroll;
}

.red_block {
	clear: both;
	padding: 10px 15px;
	border: solid 1px #ff2c2c;
	color: #ff2c2c;
	font-weight:bold;
}



@media only screen and (max-width: 736px) {
	#header {
		padding: 20px 3.125%;
	}
	
	#main {
		padding: 25px 3.125%;
	}
	
	.txtarea {
		margin: 0  3.125% 25px;
	}

	.txtarea .ph {
		width: 100%;
		margin: 0 auto;
	}
	
	.note_block {
		clear: both;
		padding: 15px;
		border: solid 1px #CCCCCC;
		height: 150px;
		overflow: scroll;
	}

}

/*---------------------------------
	text
---------------------------------*/
#main h1 {	
	font-family: 'Noto Serif JP', serif;
	font-size: 197%;
	font-weight: bold;
	margin: 0 0 15px 0;
}

#main h1 span {
	font-size: 75%;
}

#main h1 a {
	color: #ffffff;
	text-decoration: none;
}

#main h1 img {
	display: block;
	margin-right: auto;
}

#main h2 {
	font-family: 'Noto Serif JP', serif;
	font-size: 131%;
	font-weight: bold;
	margin: 0 0 10px;
}

#main p.midashi {
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, sans-serif;
	font-size: 131%;
	color: #314C89;
	font-weight: bold;
	margin: 0 0 10px;
}

p {
	margin-bottom: 15px;
}

ul {
	list-style: none;
	margin-bottom: 25px;
}

/* 注釈 */

ul.asterisk,
ul.asterisk_m {
	list-style: none;
}

ul.asterisk li {
	background: none;
	text-indent: -1.0em;
	margin-left: 1em;
	padding-left: 0;
}

ul.asterisk_m li {
	background: none;
	text-indent: -2em;
	margin-left: 2em;
	padding-left: 0;
}


@media only screen and (max-width: 736px) {
	#main h1 {	
		padding: 0 3.125%;
	}	
}



/*---------------------------------
	form
---------------------------------*/

.form_block {
	background: #ffffff;
	color: #000000;
	margin-top: 20px;
}

.form_block p.box {
	padding: 15px 10px 0;
}

.form_block dd p {
	margin: 5px 0 10px ;
}

/*
.form_block dl {
	clear: both;
	zoom: 1;
	border-top: solid 1px #CCCCCC;
}

.form_block dl.first {
	border-top: none;
	padding-top: 5px;
}

.form_block dl:after {
	content: "";  
	display: block; 
	visibility: hidden; 
	clear: both; 
	height: 0.1px; 
	font-size: 0.1em; 
	line-height: 0;
}

.form_block dl dt {
	width: 230px;
	padding: 15px 10px;
	box-sizing: border-box;
	float: left;
	font-weight: bold;
}

.form_block dl dd {
	padding: 15px;
	margin: 0 0 0 240px;
	box-sizing: border-box;
	background:#f4fdff;
}
*/
.form_block dl {
	clear: both;
	border-top: solid 1px #CCCCCC;
	display: table;
	width: 100%;
}
.form_block dl dt {
	display: table-cell;
	box-sizing: border-box;
	padding: 12px 15px;
	width: 236px;
	font-weight: bold;
}
.form_block dl dd {
	display: table-cell;
	box-sizing: border-box;
	padding: 12px 15px;
	
}
.form_block input[type="date"],
.form_block input[type="number"],
.form_block input[type="email"],
.form_block input[type="tel"],
.form_block input[type="text"],
.form_block select {
	height: 34px;
	margin-bottom: 4px;
	padding: 6px 12px;
	box-sizing: border-box;
	font-size: 14px;
	line-height: 1.428571429;
	color: #555555;
	vertical-align: middle;
	background-color: #f6f6f6;
	background-image: none;
	border: 1px solid #e4e4e4;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, sans-serif;
	/*border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
		  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	-webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
		  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;*/
}

.form_block input[type="date"],
.form_block input[type="number"],
.form_block input[type="email"],
.form_block input[type="tel"] {
	ime-mode: disabled;
}

.form_block textarea {
	margin-bottom: 4px;
	padding: 6px 12px;
	box-sizing: border-box;
	font-size: 13px;
	line-height: 1.428571429;
	color: #555555;
	vertical-align: top;
	background-color: #ffffff;
	background-image: none;
	border: 1px solid #cccccc;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, sans-serif;
	/*border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
		  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	-webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
		  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;*/
}

.form_block input[type="date"]:focus,
.form_block input[type="number"]:focus,
.form_block input[type="email"]:focus,
.form_block input[type="tel"]:focus,
.form_block input[type="text"]:focus,
.form_block select:focus {
  border-color: #fcb621;
  outline: 0;
}

.form_block input[type="date"].error,
.form_block input[type="number"].error,
.form_block input[type="email"].error,
.form_block input[type="tel"].error,
.form_block input[type="text"].error,
.form_block select.error {
	border-color: #fc4777;
	outline: 0;
}

.form_block input[type="date"].success,
.form_block input[type="number"].success,
.form_block input[type="email"].success,
.form_block input[type="tel"].success,
.form_block input[type="text"].success,
.form_block select.success {
	border-color: #29abe2;
	outline: 0;
}

.form_block input[type="checkbox"],
.form_block input[type="radio"] {
	margin-right: 5px;
	margin-top: 2px;
	width: 20px;
    height: 20px;
    vertical-align: middle;
}
/*
@media screen and (-webkit-min-device-pixel-ratio:0) { */
_::content, _:future, body:not(*:root) { 
	.form_block input[type="checkbox"],
	.form_block input[type="radio"] {
		width: 13px;
    	height: 13px;
		margin-top: 5px;
		-webkit-transform-origin: right bottom;
		-webkit-transform: scale( 1.5 , 1.5 );
		
	}
}

@-moz-document url-prefix() {
	.form_block input[type="checkbox"],
	.form_block input[type="radio"] {
		width: 13px;
    	height: 13px;
		margin-top: 5px;
		-moz-transform-origin: right bottom;
	  	-moz-transform: scale( 1.5 , 1.5 );
		margin-left: 5px;
	}
}


.btn_area_search {
	 border-radius: 5px; 
    -webkit-border-radius: 5px;  
    -moz-border-radius: 5px;
	padding: 5px 18px;
	margin: 0 0 0 10px;
	font-size: 100%;
	border: solid 1px #cccccc;
	box-sizing: border-box;
}

.text_input_xs{
	width: 98px;
}

.text_input_s {
	width: 150px;
}

.text_input_m {
	width: 300px;
}

.text_input_l {
	width: 100%;
}

.text_area_l {
	width: 100%;
}

.text_area_l02 {
	width: 70%;
}

.form_block label,.box label {
	cursor: pointer;
	vertical-align: middle;

}

.form_block .area label,.box label{
	cursor: pointer;
	vertical-align: middle;
	white-space: nowrap;
	width: 16%;
}

.form_block .area label.width-none{
	cursor: pointer;
	vertical-align: middle;
	white-space: nowrap;
	width: 22%;
}


@media screen and (min-width: 736px) and ( max-width:1024px) {
	.form_block .area label.width-none{
		width: auto;
	}
}

@media screen and (min-width: 736px) and ( max-width:1024px) {
	.form_block .area label.width-none{
		width: auto;
	}
}

@media only screen and (max-width: 736px) {	
	.form_block .area label,.box label{
		width: auto;
	}
}


@media only screen and (min-device-width:768px) and (max-device-width:1024px) {
	.form_block .area label,.box label{
		width: auto;
	}
}


@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait) {
 .form_block .area label,.box label{
		width: auto;
	}
}

@media only screen and (max-width: 736px) {	
	
	.text_area_l02 {
		width: 100%;
	}
	
	.form_block .area label,.box label{
		cursor: pointer;
		vertical-align: middle;
		white-space: normal;
		width: 100%;
	}
	
	.form_block .area label.width-none{
		width: 100%;
	}
	
}	


.label_radio {
	margin-right: 30px;
}

.label_c {
	margin: 10px 0 15px;
	display: block;
}

.label_num {
	margin-left: 20px;
}
 
.txt_required {
	color: #ffffff;
	background: #cc0000;
	font-weight: 400;
	margin-left: 7px;
	padding: 0 4px;
	font-size: 10px;
	line-height: 1.5;
	vertical-align: middle;
	/* border-radius: 2px; 
    -webkit-border-radius: 2px;  
    -moz-border-radius: 2px;*/
}
.form_block dl dt .txt_required {
	float: right;
}

.txt_any {
	color: #ffffff;
	background: #85d077;
	font-weight: 400;
	margin-left: 7px;
	padding: 0 10px;
	font-size: 11px;
	vertical-align: middle;
	 border-radius: 2px; 
    -webkit-border-radius: 2px;  
    -moz-border-radius: 2px;
}

.icon_success {
	color: #ffffff;
	background: #29abe2;
	font-weight: 400;
	margin-left: 7px;
	padding: 0 10px;
	font-size: 11px;
	vertical-align: middle;
	 border-radius: 2px; 
    -webkit-border-radius: 2px;  
    -moz-border-radius: 2px;
}

.icon_error {
	color: #ffffff;
	background: #ed1e79;
	font-weight: 400;
	margin-left: 7px;
	padding: 0 10px;
	font-size: 11px;
	vertical-align: middle;
	 border-radius: 2px; 
    -webkit-border-radius: 2px;  
    -moz-border-radius: 2px;
}

.txt_error {
	color: #cc0000;
	font-weight: 400;
}

div.error {
	background: #fc4777;
	color: #ffffff;
	font-weight: 400;
}

/*　ime-mode 設定　*/
input.ime1 { ime-mode: auto; }
input.ime2 { ime-mode: active; }
input.ime3 { ime-mode: disabled; }
textarea.ime4 { ime-mode: inactive; }


.pp ol {
  margin-bottom: 25px;
}

.pp ol li {
  margin-bottom: 3px;
  list-style-type: decimal;
  list-style-position: outside;
  margin-left: 1.5em;
}


/*---------------------------------
	ボタン
---------------------------------*/
.form_btn_block {
	text-align: center;
	margin-bottom: 40px;
	clear: both;
	padding-top: 1.5em;
}

.form_btn_block form {
	display: inline;
}

.btn_denial {
	color: #ffffff;
	background: #999999;
	padding: 10px 5px;
	margin: 0 10px;
	box-sizing: border-box;
	min-width: 200px;
	border: none;
	font-size: 1.0em;
	font-weight: bold;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, sans-serif;
}

.btn_denial:hover {
	background: #aaaaaa;
}
.btn_approval {
	color: #ffffff;
	background: #333333;
	padding: 15px 30px;
	margin: 0 10px;
	box-sizing: border-box;
	width: auto;
	min-width: 200px;
	border: none;
	font-size: 1.0em;
	font-weight: bold;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, sans-serif;
	}
.btn_approval:hover {
	background: #555555;
	}
	.btn_approval small {
		font-size: .9em;
	}
form label{
	display: inline-block;
	width: auto;
	/*min-width: 18em;*/
	/*padding: 5px 5px;*/
	margin-right: 18px;
	margin-bottom: 8px;
	/*border-radius: 4px;
	text-shadow: 1px 1px 0 #fff;*/
	/*border: 1px solid #aaa;
	background: -ms-linear-gradient(top, #fff 0%, #eee 100%);
	background: -moz-linear-gradient(top, #fff 0%, #eee 100%);
	background: -o-linear-gradient(top, #fff 0%, #eee 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #eee));
	background: -webkit-linear-gradient(top, #fff 0%, #eee 100%);
	background: linear-gradient(to bottom, #fff 0%, #eee 100%);*/
	opacity: .8;
	font-size: .9em;
	}
	form label.checked{
		opacity: 1;
		/*background: -ms-linear-gradient(top, #ddd 0%, #ccc 100%);
		background: -moz-linear-gradient(top, #ddd 0%, #ccc 100%);
		background: -o-linear-gradient(top, #ddd 0%, #ccc 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ddd), color-stop(1, #ccc));
		background: -webkit-linear-gradient(top, #ddd 0%, #ccc 100%);
		background: linear-gradient(to bottom, #ddd 0%, #ccc 100%);*/
}

input::-webkit-input-placeholder {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, sans-serif;
}
input:-moz-placeholder {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, sans-serif;
}
input::-moz-placeholder {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, sans-serif;
}
input:-ms-input-placeholder {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", YuGothic, sans-serif;
}

@media only screen and (max-width: 736px) {
		
	
	.form_block {
		padding: 15px 3.125%;
	}
	
	.form_block dl {
		display: block;
	}

	.form_block dl dt {
		display: block;
		width: auto;
		padding: 10px;
		box-sizing: border-box;
	}
	
	.form_block dl dd {
		display: block;
		padding: 10px;
		box-sizing: border-box;
	}
	
	.text_input_s {
		width: 48%;
	}
	
	.text_input_m {
		width: 100%;
	}
	
	.label_num {
		margin-left: 0;
	}
	
	.label_c {
		margin: 10px 0 15px;
		padding: 8px 5px;
		display: block;
	}
	
	.form_btn_block form {
		display: block;
	}
	
	.btn_approval {
		display: block;
		margin: 10px auto;
		-webkit-appearance: none;
		border-radius: 0;
	}
	
	.btn_denial {
		display: block;
		margin: 10px auto;
		-webkit-appearance: none;
		border-radius: 0;
	}
	
	.mr10 { margin-right: 3.125% !important; }
	
	h2 .txt_required {
		float: right; 
	}


	.btn_denial{font-size: 1em;}
	
	.btn_approval,
	.btn_denial,
	form label,
	#datepicker{
		width: 100%;
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
	}
}


/*ステップ表示
-----------------------------------------------*/
.step{
  list-style-type: none;
  display:table;
  width:100%;
  padding:0;
  margin:0;
  overflow:hidden;
}
.step li{
  display:table-cell;
  position:relative;
  background: #707070;
  padding: 1em 0.5em 1em 2em;
  color: #fff;
}
.step li:last-child{
  padding-right: 1em;
}
.step li:last-child:before,
.step li:last-child:after{
  display:none;
}
.step li:before,
.step li:after{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  margin: auto;
}
.step li:before{
  top:-15px;
  right:-1em;
  border-style: solid;
  border-color: transparent transparent transparent #fff;
  border-width: 40px 0 40px 1em;
  z-index: 10;
}
.step li:after{
  top:-15px;
  right:-.8em;
  border-style: solid;
  border-color: transparent transparent transparent #707070;
  border-width: 40px 0 40px 1em;
  z-index: 10;
}
.step li.is-current{
  background: #314C89;
  font-weight: bold;
}
.step li.is-current:after{
  border-color: transparent transparent transparent #314C89;
}

@media only screen and (max-width: 736px) {
	.step{
		
	}
	.step li{
	  padding: 1em 1.0em 1em 1.5em;
	  color: #fff;
	  font-size:12px;
	}
	
	.step li:last-child{
		padding-right: 0.5em;
	}

}



/*表示
----------------------------------------*/
/* PCだけ表示 */
.visible_pc {
	display: block !important;
}
/* SPだけ表示 */
.visible_sp {
	display: none !important;
}

/* PCだけ表示 */
.visible_pc_inline {
	display: inline !important;
}
/* SPだけ表示 */
.visible_sp_inline {
	display: none !important;
}
@media screen and (max-width: 736px) {
	/* PCだけ表示 */
	.visible_pc {
		display: none !important;
	}
	/* SPだけ表示 */
	.visible_sp {
		display: block !important;
	}
	
	/* PCだけ表示 */
	.visible_pc_inline {
		display: none !important;
	}
	/* SPだけ表示 */
	.visible_sp_inline {
		display: inline !important;
	}
}








.stepBar {
  position: relative;
  list-style: none;
  margin: 0 0 1em;
  padding: 0;
  text-align: center;
  width: 100%;
  overflow: hidden;
  *zoom: 1;
}
.stepBar .step {
  position: relative;
  float: left;
  display: inline-block;
  line-height: 40px;
  padding: 0 40px 0 20px;
  background-color: #eee;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.stepBar .step:before, .stepBar .step:after {
  position: absolute;
  left: -15px;
  display: block;
  content: '';
  background-color: #eee;
  border-left: 4px solid #FFF;
  width: 20px;
  height: 20px;
}
.stepBar .step:after {
  top: 0;
  -moz-transform: skew(30deg);
  -ms-transform: skew(30deg);
  -webkit-transform: skew(30deg);
  transform: skew(30deg);
}
.stepBar .step:before {
  bottom: 0;
  -moz-transform: skew(-30deg);
  -ms-transform: skew(-30deg);
  -webkit-transform: skew(-30deg);
  transform: skew(-30deg);
}
.stepBar .step:first-child {
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.stepBar .step:first-child:before, .stepBar .step:first-child:after {
  content: none;
}
.stepBar .step:last-child {
  -moz-border-radius-topright: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.stepBar .step.current {
  color: #FFF;
  background-color: #26bfa1;
}
.stepBar .step.current:before, .stepBar .step.current:after {
  background-color: #26bfa1;
}
.stepBar.step2 .step {
  width: 50%;
}
.stepBar.step3 .step {
  width: 33.333%;
}
.stepBar.step4 .step {
  width: 25%;
}
.stepBar.step5 .step {
  width: 20%;
}