.msf-view {
            display: none;
        }
        
        .msf-navigation {
            text-align: center;
        }
        
        .msf-nav-button {
            display: none;
        }
        
        .msf-header {
            padding-top: 10px;
            margin-bottom: 40px;
            color: #777;
        }
        
        .msf-header .msf-step {
            font-size: 20px;
            /*display : inline-block;
       vertical-align : middle;*/
        }

        .msf-header .msf-step:hover {
            cursor: pointer;
        }
        
        .msf-header .msf-step i.fa {
            height: 60px;
            width: 60px;
            line-height: 55px;
            text-align: center;
            border: 3px solid #777;
            border-radius: 100%;
            font-size: 30px;
            margin-left: 10px;
            margin-right: 10px;
        }
        
        .msf-header .msf-step.msf-step-complete {
            /*color: #ef4035;*/
            color: green;
        }
        
        .msf-header .msf-step.msf-step-complete i.fa {
            /*border-color : #ef4035;*/
            border-color: green;
        }

        .msf-header .msf-step.msf-step-incomplete {
            /*color: #ef4035;*/
            color:red;
        }
        
        .msf-header .msf-step.msf-step-incomplete i.fa {
            /*border-color : #ef4035;*/
            border-color: red;
        }
        
        .msf-header .msf-step.msf-step-active,
        .msf-header .msf-step.msf-step-active.msf-step-complete,
        .msf-header .msf-step.msf-step-active.msf-step-incomplete {
            color: blue;
            /*color:#3c763d;*/
        }
        
        .msf-header .msf-step.msf-step-active i.fa,
        .msf-header .msf-step.msf-step-active.msf-step-complete i.fa,
        .msf-header .msf-step.msf-step-active.msf-step-incomplete i.fa  {
            border-color: blue;
            /*border-color : #3c763d;*/
        }

        


.input-validation-error {
    border-color: red;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(255, 0,0,0.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(255, 0,0,0.6);
}

    .input-validation-error:focus {
        border-color: red;
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(255, 0,0,0.6);
        box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(255, 0,0,0.6);
    }


#formarea .msf-nav-button { display: block; width: 60%; margin: 20px auto; padding: 15px; cursor: pointer; color: #fff; font-size: 16px; background: #26C3DC url('./images/form-btn.png') 90% 50%  no-repeat; border: none; border-bottom: solid 4px #21a8bc; border-radius: 10px; }
#formarea .msf-nav-button:hover { cursor: pointer -ms-transform: translateY(4px); -webkit-transform: translateY(4px); transform: translateY(2px); border-bottom: none; -webkit-transition: all 0.3s; transition: all 0.3s; }


#formarea button[data-type="next"], #formarea input[type="submit"] { display: block; width: 60%; margin: 20px auto; padding: 15px; cursor: pointer; color: #fff; font-size: 16px; background: #26C3DC url('./images/form-btn.png') 90% 50%  no-repeat; border: none; border-bottom: solid 4px #21a8bc; border-radius: 10px; }
#formarea button[data-type="next"]:hover, #formarea input[type="submit"]:hover { cursor: pointer -ms-transform: translateY(4px); -webkit-transform: translateY(4px); transform: translateY(2px); border-bottom: none; -webkit-transition: all 0.3s; transition: all 0.3s; }



#formarea button[data-type="submit"]{ display: block; width: 60%; margin: 20px auto; padding: 15px; cursor: pointer; color: #fff; font-size: 16px; background: #26C3DC url('./images/form-btn.png') 90% 50%  no-repeat; border: none; border-bottom: solid 4px #21a8bc; border-radius: 10px; }
#formarea button[data-type="submit"]:hover { cursor: pointer -ms-transform: translateY(4px); -webkit-transform: translateY(4px); transform: translateY(2px); border-bottom: none; -webkit-transition: all 0.3s; transition: all 0.3s; }

@media screen and (max-width: 768px){
#formarea button[data-type="submit"]{ display: block; width: 95%; margin: 20px auto; padding: 15px; cursor: pointer; color: #fff; font-size: 16px; background: #26C3DC url('./images/form-btn.png') 90% 50%  no-repeat; border: none; border-bottom: solid 4px #21a8bc; border-radius: 10px; }
#formarea button[data-type="submit"]:hover { cursor: pointer -ms-transform: translateY(4px); -webkit-transform: translateY(4px); transform: translateY(2px); border-bottom: none; -webkit-transition: all 0.3s; transition: all 0.3s; }
}

/* mailformproのリセット */
.mfp_element_submit, .mfp_element_button,
.mfp_element_submit:hover, .mfp_element_reset:hover, .mfp_element_button:hover {
	box-shadow: none;
	background: none;
}
.mfp_element_submit, .mfp_element_reset, .mfp_element_button {
	border-radius: none;
	font-size: inherit;
}

/* origial */
.msf label.error {
	color: #cc3333;
	display: block !important;
	margin-top: .5em;
}
select.error,
input.error {
	color: #777777 !important;
	background-size: 13px;
}
.area-step {
	text-align: center;	
	margin: 40px 0;
}
.area-step li {
	display: inline-block;
	color: #777777 !important;
	padding-left: 0 !important;
}
.area-step li::before {
	display: none !important;
}
.area-step li::after {
	display: inline-block;
	content: ">>";
	margin: 0 10px;
	color: #777777 !important;
	font-weight: normal;
}
.area-step li:last-child::after {
	display: none;
}
.area-step li.msf-step-active {
	color: #F55E5E !important;
	font-weight: bold;
}
.msf-navigation .msf-nav-button {
	background-color: transparent;
	margin-top: 20px;
	text-decoration: underline;
	border: none;
  color: #333;
  padding: 0;
	text-shadow: none;
}
.msf-navigation button.btn-submit {
	background: #4DB332;
	color: #ffffff;
	border: none;
	width: 100%;
	max-width: 210px;
	text-align: center;
	padding: 10px 20px;
	text-decoration: none;
	margin-top: 0;
	border-radius: 0;
}

@media screen and (max-width: 768px){
	.msf-title {
	}
	.msf-header {
		margin-top: 0;
		margin-bottom: 20px;
		padding: 0;
	}
	.msf-header .msf-step {
		font-size: 16px;
	}
	.msf-header.step5 .msf-step {
		font-size: 14px;
	}
	.area-step {
		margin: 20px 0;
	}
	.area-step li::after {
    margin: 0 5px;
    vertical-align: middle;
    font-size: 10px;		
	}
	#main .msf input {
		max-width: 100% !important;
		width: 100% !important;
	}
}

input[type="date"]:focus, input[type="date"]:active,
input[type="text"]:focus,input[type="text"]:active,input[type="password"]:focus,input[type="password"]:active,input[type="datetime"]:focus,input[type="datetime"]:active,input[type="datetime-local"]:focus,input[type="datetime-local"]:active,input[type="date"]:focus,input[type="date"]:active,input[type="month"]:focus,input[type="month"]:active,input[type="time"]:focus,input[type="time"]:active,input[type="week"]:focus,input[type="week"]:active,input[type="number"]:focus,input[type="number"]:active,input[type="email"]:focus,input[type="email"]:active,input[type="url"]:focus,input[type="url"]:active,input[type="search"]:focus,input[type="search"]:active,input[type="tel"]:focus,input[type="tel"]:active,input[type="color"]:focus,input[type="color"]:active,select:focus,select:active,textarea:focus,textarea:active,.field:focus,.field:active {
	background-color: #f7f8fa; 
}

input[type="date"].error,input[type="date"].is-invalid,input[type="text"].error,input[type="text"].is-invalid,input[type="password"].error,input[type="password"].is-invalid,input[type="datetime"].error,input[type="datetime"].is-invalid,input[type="datetime-local"].error,input[type="datetime-local"].is-invalid,input[type="date"].error,input[type="date"].is-invalid,input[type="month"].error,input[type="month"].is-invalid,input[type="time"].error,input[type="time"].is-invalid,input[type="week"].error,input[type="week"].is-invalid,input[type="number"].error,input[type="number"].is-invalid,input[type="email"].error,input[type="email"].is-invalid,input[type="url"].error,input[type="url"].is-invalid,input[type="search"].error,input[type="search"].is-invalid,input[type="tel"].error,input[type="tel"].is-invalid,input[type="color"].error,input[type="color"].is-invalid,select.error,select.is-invalid,textarea.error,textarea.is-invalid,.field.error,.field.is-invalid {
color: #fbe3e4;
border-color: #fbe3e4;
background-color: #fff;
background-position: 99% center;
background-repeat: no-repeat;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2NDM0NDREQkYwNEIxMUUyOTI4REZGQTEzMzA2MDcyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2NDM0NDREQ0YwNEIxMUUyOTI4REZGQTEzMzA2MDcyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjQ3ODRGRkE2RjA0QTExRTI5MjhERkZBMTMzMDYwNzI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjY0MzQ0NERBRjA0QjExRTI5MjhERkZBMTMzMDYwNzI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+U8iT5wAAAedJREFUeNqk1U9I02Ecx/HtV3aIFAc1hcRDUoGXRAq0oNLA2CrsEFmHbikZu0iQYIFGYAiegkCpLipBxPpDEBMUzB0EhSG2LhG7hMR2GviPgUTvB57Bw8P3+U23B16HPX8+e/b8nt93wezZSMCnhXETF3AcB5BDCnH8Dq98ExcGHcFn8Ah3cdDni+fxnPDv9oAnTB7CKu6VCFXtChZy56LxUjt+jfuB8toSOth9wd7xWAWhqrUjYR/FRTwWJm+iIPT/w7bQf5ljiZnBg45dtKFX6H+LU8gIY8OEV6vgTkStwXWE8BPTGDHGPqNPz2mCfSOOYkA99TvCt1bhGPL68zMcwmncMuape10jrI+q4BbHi/FLn31S9z2x5tRhTc+1W506ipM+T3oRD4X+8+qtc4SqFvL0z/Fr14S+Szjis8bz9Lvvaq8cwS/wwGfdlqfPSWqTiFlX77o13u9Ym1PBs8JAytpRoy44X9Ft9E/gvbA+rYKn8NcaaMVc8UHgBw4b9/iqUQZ6hOAJFbyDcUflmsEX4a6+wTtHGfhAIUqa1U29Zc2BytouThD8x6xuN5CtMPi2CrXLZkZf/HyZoRFCP7n+QVR4PV7uI/AjGghN7OU/r1ilnqILtfpNC+o6vIFljBKYlhb/F2AAgaBsWR5wRiIAAAAASUVORK5CYII=);
outline-color: #fbe3e4;
}

/* cf7のエラーは重複するため非表示 */
.msf .wpcf7-not-valid-tip {
	display: none;
}

/* mailformproのエラーは重複するため非表示 */
div.mfp_err {
	display: none !important;
	color: #cc3333 !important;
	background: none !important;
	padding-left: 0 !important;
}

/* msfは最終ステップのcheckboxとradioのエラー表示がされないのでmailformproのエラーを表示 */
div.mfp_err.disp {
	display: block !important;
}

/* トップページ＞フォーム設置用 */
.contactform {
	background: #fffbe9;
	padding: 0 0 110px;
	border-bottom: 4px solid #fff5c6;
}
.contactform form {
	max-width: 925px;
	width: auto;
	background: #fff;
	border-radius: 10px;
	margin: 20px auto 30px;
	box-shadow: 0 0 5px 0 #cecece;
	padding: 35px 0 55px;
}

.contactform .area-step .step_1 {
    font-weight: bold;
    color: #f55e5e !important;
}
.contactform form .area-step {
	margin: 0 0 45px;
}

.contactform form .area-step .step_1 {
	font-weight: bold;
	color: #f55e5e !important;
}

.contactform dl {
	width: 700px;
	margin: 0 auto 10px;
	display: -ms-flex;
	display: flex;
	flex-wrap: wrap;
	box-sizing: border-box;
}

.contactform dl dt {
	width: 250px;
	border-top: 1px solid #cbcbcb;
	text-align: right;
	padding: 10px;
	font-size: 16px;
	box-sizing: border-box;
	font-weight: bold;
}

.contactform dl dt span {
	font-size: 14px;
	color: #fff;
	background: #555;
	margin-left: 5px;
	border-radius: 5px;
	padding: 2px 5px 1px;
	font-weight: normal;
	line-height: 1;
	vertical-align: middle;
}

.contactform dl dt span.required-field {
	background: #f13a56;
	padding: 5px;
}

.contactform dl dd {
	width: 450px;
	border-top: 1px solid #cbcbcb;
	box-sizing: border-box;
	padding: 15px 0 15px 20px;
	font-size: 0;
}

.contactform dl dd p.txt {
	font-weight: bold;
	margin: 0 0 8px 0;
	font-size: 14px;
	font-weight: bold;
}

.contactform dl dd label {
	display: inline-block;
	font-size: 16px;
	margin: 0 10px 8px 0;
	padding: 2px 10px 0 25px;
	border: 1px solid #eee;
	border-radius: 3px;
}

.contactform dl dd label:hover {
	cursor: pointer;
}

.contactform dl dd input[type="radio"],
.contactform dl dd input[type="checkbox"] {
	display: none;
}

.contactform dl dd label.radio_btn {
	position: relative;
}

.contactform dl dd label.radio_btn::before {
	display: block;
	width: 14px;
	height: 14px;
	content: "";
	border: 1px solid #a2a2a2;
	border-radius: 50%;
	position: absolute;
	top: 6px;
	left: 5px;
}

.contactform dl dd input[type="radio"]:checked + label::after {
	display: block;
	width: 10px;
	height: 10px;
	content: "";
	background: #1687ff;
	border-radius: 50%;
	position: absolute;
	top: 9px;
	left: 8px;
}

.contactform dl dd label.check_btn {
	position: relative;
}

.contactform dl dd label.check_btn::before {
	display: block;
	width: 12px;
	height: 12px;
	content: "";
	border: 1px solid #a2a2a2;
	border-radius: 3px;
	position: absolute;
	top: 7px;
	left: 5px;
}

.contactform dl dd input[type="checkbox"]:checked + label.check_btn::before {
	border: none;
	background: #1687ff;
}

.contactform dl dd input[type="checkbox"]:checked + label::after {
	display: block;
	content: "×";
	font-size: 12px;
	color: #fff;
	position: absolute;
	top: 3px;
	left: 5px;
}

.contactform dl dd textarea {
	width: 400px;
	height: 70px;
	border: 1px solid #cbcbcb;
	border-radius: 5px;
	box-shadow: 0 0 5px #ccc inset;
	font-size: 14px;
	line-height: 1.3em;
	padding: 0.5em;
	box-sizing: border-box;
}

.msf-navigation button.btn-submit {
	display: block;
	padding: 0;
	background: transparent;
	width: 210px;
	height: 41px;
	margin: 0 auto;
	border-radius: 20px;
}

.msf-navigation button.btn-submit img {
	border-radius: 20px;
	width: 100%;
}

.msf-navigation button.btn-submit:hover {
	opacity: 0.8;
	cursor: pointer;
}

.contactform .tel {
	max-width: 910px;
	width: 100%;
	margin: 0 auto;
}
.contactform .tel img {
	width: 100%
}
.forfix {
	display: none;
}


@media screen and (max-width: 768px){
	.contactform {
		background: #fffbe9;
		padding: 0 0 10vw;
		border-bottom: 4px solid #fff5c6;
	}

	.contactform form {
		width: 90%;
		margin: 0 auto 5vw;
		padding: 5vw 0 10vw;
	}

	.contactform form .area-step {
		margin: 0 0 5vw;
	}

	.contactform form .area-step li {
		font-size: 3vw;
	}

	.contactform dl {
		width: 90%;
		margin: 0 auto 3vw;
	}

	.contactform dl dt {
		width: 100%;
		text-align: left;
		padding: 2vw;
		font-size: 4vw;
	}

	.contactform dl dt span {
		font-size: 3vw;
		margin-left: 2vw;
		border-radius: 1vw;
		padding: 0.5vw 1vw 0;
	}

	.contactform dl dd {
		width: 100%;
		border-top: none;
		padding: 2vw 0 2vw 2vw;
	}

	.contactform dl dd label {
		font-size: 4vw;
		margin: 0 2vw 3vw 0;
		padding: 1vw 2vw 0.5vw 5vw;
		border-radius: 2vw;
	}

	.contactform dl dd label.radio_btn::before {
		width: 3vw;
		height: 3vw;
		top: 2.5vw;
		left: 1vw;
	}

	.contactform dl dd input[type="radio"]:checked + label::after {
		width: 2.5vw;
		height: 2.5vw;
		top: 3vw;
		left: 1.5vw;
	}

	.contactform dl dd textarea {
		width: 100%;
		height: 30vw;
		border-radius: 2vw;
		font-size: 4vw;
	}

	.msf-navigation button.btn-submit {
		width: 50vw;
		height: 9vw;
		border-radius: 5vw;
	}

	.msf-navigation button.btn-submit img {
		border-radius: 5vw;
	}

	.contactform .tel {
		width: 90%;
	}

	.forfix {
		display: none;
	}

	.forfix.fix {
		display: block;
		position: fixed;
		bottom: 0;
		z-index: 100;
		padding: 2vw 10vw;
		background: rgba(255,255,255,0.6);
	}

	.forfix a,.forfix a img {
		border-radius: 1vw;
	}

}