@charset "utf-8";

/*----------------------------------------------------------
 COMMON
----------------------------------------------------------*/

/* mainvisual */
#mainVisual_no_image { background:#f8f8f8; }


.step_box { margin-bottom:50px; }
.step_box ul { display:flex; justify-content:space-between; max-width:728px; margin:0 auto; }
.step_box ul li { width:30%; border:1px solid #ccc; background:#fff; padding:10px; position:relative; }
.step_box ul li span { position:relative; padding-right:1em; }
.step_box ul li span:after { position:absolute; top:2px; right:0; content:" | "; width:1em; height:1em; line-height:1; }
.step_box ul li.active {  border:1px solid #69b9d2; background:#69b9d2; color:#fff; padding-right:3%; }
.step_box ul li.active:after { position:absolute; z-index:-1; content:""; top: 50%;right: -28%;width: 30%; height:2px; background:#69b9d2; }
.step_box ul li:nth-child(2):after { position:absolute; z-index:-1; content:""; top: 50%;right: -28%;width: 30%; height:2px; background:#ccc; }
.step_box ul li:nth-child(2).active:before { position:absolute; z-index:-1; content:""; top: 50%;left: -28%;width: 30%; height:2px; background:#69b9d2; }
.step_box ul li:nth-child(2):before { position:absolute; z-index:-1; content:""; top: 50%;left: -28%;width: 30%; height:2px; background:#ccc; }
.step_box ul li:nth-child(3).active:before { position:absolute; z-index:-1; content:""; top: 50%;left: -28%;width: 30%; height:2px; background:#69b9d2; }
.step_box ul li:nth-child(3).active:after { display:none; }

.item { display:flex; align-items: center; align-content: center; border-bottom:1px solid #d2d2d2; padding:20px 0; }
.item_left { position: relative; width: 220px; min-width: 220px; padding: 25px 0 25px 0px; }
.item_right { position: relative; width: 100%; }
.item input { padding:10px; background:#f7f6f8; border:none; width: 100%;}
.item select { padding:10px; display: block; border:none; -webkit-appearance: none;-moz-appearance: none; appearance: none;	width:100%;	background:#f7f6f8; }
.item textarea { padding:10px; background:#f7f6f8; border:none; width: 100%;}

.textbox01 { max-width:520px; display:flex; justify-content:flex-start; align-items: center; align-content: center; line-height:1;  }
.textbox01:nth-of-type(2) { margin:20px 0; }
.textbox01:nth-of-type(3) { margin:0 0 20px; }
.textbox01 label { width:110px; }

.input_wrap { display:flex; justify-content:space-between;  }
.input_wrap > input { margin-right:5px; }
.input_wrap span.bar { display: inline-block; position: relative; top:10px; }
#seminar .input_wrap span.bar { top:0px; }

.item input.text01 { max-width:300px; }
.item input.text02 { max-width:130px; }


.select01 { min-width:130px; position:relative; display: inline-block; }
.select01:after { content:""; position:absolute; z-index:10; top:0; left:auto; bottom:0; right:10px; margin:auto; width:0; height:0; border-style:solid; border-width:5px 5px 0 5px; border-color:#333 transparent transparent transparent; pointer-events:none; box-sizing:border-box; }

.select01.no_bg:after { display:none; }

.textbox01 .select01 { min-width:193px; }

.checkbox01-input{ display:none;}
.checkbox01-parts{ padding-left:36px; position:relative; margin-right:20px;}
.checkbox01-parts::before{ content:""; display:block; position:absolute; top:-5px; left:0; width:22px; height:22px; border:none; background:#f7f6f8; }
.checkbox01-input:checked + .checkbox01-parts{  /*color:#009a9a;*/ }
.checkbox01-input:checked + .checkbox01-parts::after{ content:""; display:block; position:absolute; top:-5px; left:5px; width:7px; height:14px; transform:rotate(40deg); border-bottom:3px solid #69b9d2; border-right:3px solid #69b9d2; }

.checkbox01.is-white .checkbox01-parts::before{ background: #fff; }

.radio01-input{ display:none;}
.radio01-parts{ padding-left:20px; position:relative; margin-right:20px;}
.radio01-parts::before{ content:""; display:block; position:absolute; top:-2px; left:0; width:16px; height:16px; border:1px solid #bfbfbf; border-radius: 50%; }
.radio01-input:checked + .radio01-parts::after{ content: "";	display: block; position: absolute;	top: 0;	left: 2px;	width: 14px;	height: 14px;	background-color: #69b9d2;	border-radius: 50%; }

/*
.radio02-input { display:none; }
.radio02-input + label { padding-left:20px; position:relative; margin-right:20px; }
.radio02-input + label::before { content: ""; display:block; position:absolute; top:0; left:0; width:15px; height:15px; border:1px solid #999; border-radius:50%; }
.radio02-input:checked + label { color:#009a9a; }
.radio02-input:checked + label::after { content:""; display:block; position:absolute; top:3px; left:3px; width:11px; height:11px; background:#009a9a; border-radius:50%; }
*/

.radio input{
	display: none;
}
.radio label{
	display: inline-block;
	position: relative;
	cursor: pointer;
	margin-left: 20px;
	padding: 10px 20px;
	border-radius: 2px;
	color: #3e4956;
	font-size: 14px;
	text-align: center;
	line-height: 1;
}
.radio label:before{
	position: absolute;
	content: "";
	top: 50%;
	left: -10px;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: #f7f6f8;
	border-radius: 50%;
}
.radio input[type="radio"]:checked + label:after {
	position: absolute;
	content: "";
	top: 50%;
	left: -4px;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-radius: 50%;
	background: #43a8c7;
}

textarea.comment { width:100%; background:#f7f6f8; border:none; padding:10px; }


:placeholder-shown { color:#ccc; }
	::-webkit-input-placeholder { color:#ccc; }
	::-moz-placeholder { color: #ccc; opacity:1; }
	:-ms-input-placeholder { color:#ccc; }


.btnSet { display:flex; justify-content:flex-start; align-items: center; align-content: center; margin:0 auto; }

button { border:none; cursor:pointer; width:350px; margin-top:100px; display:block; }
button#reset { background:#999; }

input[type="text"], input[type="tel"], input[type="email"], select { height:52px; font-size:14px; }


	@media only screen and (max-width:767px) {

		.step_box ul li span { display:block; padding-right:0; }
		.step_box ul li span:after { display:none; }

		.item { flex-wrap:wrap; padding-top:0px; }
		.item_left { width:100%; }
		.item_left label { font-weight:bold; }
		.select01 { width:100%; }
		.textbox01 label { width:90px; }
		
		#seminar .input_wrap span.bar { top:0px; }
		.input_wrap span.bar { top:20px; }

		.textbox01 .select01 { width:auto; }
		.textbox01:last-of-type { display:block; }
		.textbox01:last-of-type input { width:100%; max-width:100%; display:block; margin-top:10px; }

		label[for="address2"] { display:block; margin-bottom:15px; }

		.btnSet button { margin:0 10px; }
		
		textarea.comment { height:300px; }
		
		input[type="text"],input[type="tel"],input[type="email"],
		textarea.comment,
		.item select { padding:15px 10px; }
		
	}
